用隐藏的iframe提交表单

AJAX无法上传文件是很头疼的事情，不过我们可以用隐藏在页面上的iframe提交，这里讨论的是用iframe提交表单之后，如果获取返回数据。

HTML代码片断：

form method="post" action="upload_file" target="hiddenFrame">

form的target指向iframe，通过iframe提交表单

Javascript代码：

function uploadFile() {
  $('hiddenFrame').onreadystatechange = $('hiddenFrame').onload = function() {
      if(this.readyState && this.readyState!= 'complete') {return;} //readyState判断iframe内容是否改变

      //获取iframe dom
      var frameBody = top.frames[0];
      if(!frameBody) return;
      frameBody = frameBody.document;
      if(!frameBody) return;        
      frameBody = frameBody.getElementsByTagName('body');
      if(!frameBody) return;
      frameBody = frameBody[0];
      if (!frameBody) return;
  }
}

以上代码是通过DOM获取iframe的body下返回的数据，数据可以是文本，也可以是JSON格式，如果是JSON格式，就需要evel()来解释。这种方法是在页面上写静态的iframe，复杂一点可以在页面上用JS创建iframe，不过考虑到可用性，建议还是在页面上写静态的iframe。