当Form表单包含文件上传input标签时,传统Ajax无法直接提交。本文介绍基于iframe的页面无刷新提交方案。通过设置Form的target属性指向隐藏的iframe,实现文件上传而不刷新页面。关键在于确保Form的target值与iframe的name属性完全一致,从而完成数据提交。
iframe实现文件上传提交方案
该方法基于iframe技术实现。由于需求涉及Form表单提交且包含带有文件上传功能的input标签,因此无法直接使用Ajax进行提交。
具体实现步骤如下:
参考代码示例:
<form id="form0" action="${pageContext.request.contextPath}/news/baikeAdd.form" enctype="multipart/form-data" method="POST" target="hidden_frame">
... ...
</form>
<iframe name='hidden_frame' id="hidden_frame" style='display:none'></iframe> 请注意,代码中标红部分的属性值必须保持一致。