使用iFrame模拟Ajax提交

在ajax未出现之前为了实现向服务器端提交数据而不刷新页面的效果，大多数采用的就是这种隐藏iFrame的方法。下面就简要介绍一下这个方法：
1、处理思路：
假设FormA是我们要提交数据的Form，正常来说，向服务端提交数据后，返回的response会刷新当前的Form，也就是页面会刷新一下，但是如果我们将form的target设置到另外一个iframe中，那么刷新的就是target的那个iframe。这种方法其实在一些菜单树的设计上也使用过。同时为了让用户觉察不到iframe的刷新，就需要将这个作为target的iframe隐藏起来。

2、代码实现：
写个代码说明一下：

1. < form id ="wfAuditForm" method ="post" enctype ="multipart/form-data"  target="hiddenIframe">  
   
2. < input type ="file" name ="posterUrlUploadPath" id ="posterUrlUploadPath" class ="fileUpload" title ="上传图片" />  
   
3.   
   
4. <iframe style="position: absolute, top: -1000px, left: -1000px'" id="hiddenIframe"/>

复制代码

有的时候，我们需要根据返回的数据来更新某些页面元素的值（类似于ajax的success方法），这个时候该怎么办呢？也好办。既然返回的数据都流向了hiddenIframe，那么我们在hiddenIframe中使用一个textarea将这个数据接收下来，在这个iframe中的onload事件中对这些数据进行处理，然后调用父窗口(parent)相应的处理方法来处理。

3、弊端说明：
这种方法的第一个弊端是显而易见的，就是麻烦，所以很多人投向了Ajax的怀抱，另外还有一个弊端是如果返回的数据时Json格式的话，需要将content-type设置为“text/html”而不能设置为json。

4、补充一下：
其实现在这种方法还是在使用中，常见于使用ajax来上传文件，包括ajax的倡导者google，其mail系统还是用这种方法来上传附件，这是因为js的基于安全性的考虑禁止操作文件，导致了不能使用ajax来上传文件。实际上jquery的插件jquery.form.js也是使用的这种方法来实现的文件上传。实现的文件上传。[/code]