1.iframe.jsp
<body>
<h1>测试iframe文件上传</h1>
<!--
1.要求表单的target属性名称与iframe的name名字一致
2.iframe自身特性
1).iframe标签所在的页面称之parent(父)页面
2).iframe标签所包含的页面称之为子页面
3.本测试的子页面是:controller跳转的页面,即是ok.jsp
-->
<iframe name="aaa" width="743px" height="500px;"></iframe>
<form action="/upload/upload1" target="aaa" method="post" enctype="multipart/form-data">
<input type="file" name="aa" />
上传文件路径:<input type="text" name="photo" readonly="readonly" />
<script type="text/javascript">
function test(path){
document.getElementsByName("photo")[0].value=path;
}
</script>
<input type="submit" value="提交" />
</form>
</body>
2.controller
/**
* 上传到web项目的upload文件夹中,首先要在项目中建立一个upload文件夹
* @param aa
* @param request
* @return
*/
@RequestMapping("/upload1")
public String upload1(MultipartFile aa,HttpServletRequest request){
System.out.println(aa.getOriginalFilename());
try {
//文件上传的路径
String realPath = request.getSession().getServletContext().getRealPath("/upload");
aa.transferTo(new File(realPath,aa.getOriginalFilename()));
//为测试iframe做准备
request.setAttribute("path", "upload/"+aa.getOriginalFilename());
} catch (Exception e) {
e.printStackTrace();
}
return "back/ok";
}
ok.jsp：子网页
<body>
<img alt="" src="/upload/test.png">
<script type="text/javascript">
//在子网页中调用父网页中的函数
parent.test("/${path}");
</script>
</body>
3.效果图
选择需要上传的文件
时间： 2024-10-01 00:40:39