利用iframe来实现ajax文件上传

来源:互联网 发布:马雅可夫斯基 知乎 编辑:程序博客网 时间:2024/05/18 11:48

思路:首先先要提交的文件的表单页面嵌入一个iframe,在要提交文件的表单的target属性中设置页面中嵌入的iframe的name,在js中通过axaj来提交表单,即可通过页面的iframe来提交提交文件到服务器,通过这种方式间接的提交方式即可实现异步提交文件。


1、HTML页面部分代码:

<form name="from1" id="from1" method="post" action="url"  enctype="multipart/form-data" target="ajaxUpload">     这里是重点。要上传文件enctype这个属性不可少,target的值改为iframe的name的值。

<table>

   <tr>

      <td>附件:</td>

      <td><input type="file" id="document" name="document"/></td> 

   </tr> 

</table> 

</form>

<iframe name="ajaxUpload" style="display:none"></iframe>


2、js部分代码:

$("#form1").submit();提交表单


3、服务器端代码:

Response.Write("<script type='text/javascript' type='language'>parent.window.callBackMethod('上传成功');</scrpt>");

callBackMethod是js代码中定义的一个方法的方法名,这段代码实现当文件上传成功则回调原来的js中的一个方法来进行一些后续操作。

0 0