使用用隐藏的 IFrame 提交表单开发的经验总结

Ajax虽然不错，但无法上传文件,可以用隐藏的 IFrame 提交表单部分替代Ajax。
原理如下：
1.写一个Javascript类，动态添加一个IFrame。具体是在 document.body 对象中appendChild 如下结构：

  

这是通过Style的"display:none",来实现IFrame的不可见的；
不可以设成style="width:0px,height:0px,display:none"，这样会导致一些浏览器不添加IFrame
首先用DOM的方式生成

，然后使用：
   var i_div = document.getElementById("i_frame_div");
   i_div.innerHTML=" ";
的方式将IFrame嵌入页面内；
注意，不要使用 DOM 的方式，这样会导致通过 IE 的 DOM 树不能正常获得IFrame内前网页的内容；
即不要采取如下形式：
   var i_frame=document.createElement("IFrame");
   i_frame.id="i_frame";
   ...
   var i_div = document.getElementById("i_frame_div");
   i_div.appendChild(i_frame);
这样的代码在

提交时，IFrame的内嵌页面inner.html在FireFox中会自动刷新。而IE 6.0 则会新弹出一个窗口；
src属性必须指定一个空的html文件；

2.将这个类实例化为一个全局变量，这个类的构造函数就写成以上代码；

3.写一个, 注意：
将其属性target指向IFrame的名称，这样提交后返回的目标页面就会在IFrame中，而不被看见。
将提交按钮改为一般的Button ：

4.为以上类添加一个函数sendFileRequest（），参数放入Form的名称和回调函数的指针，这样就可以像表单中在提交前添加一些需要的变量，并且提交；

5.这里注意一点，如果表单中不包含这样的元素的话，表单内容完全可以自动生成，例如可以通过函数sendFileRequest（）进行构建,或在嵌入的页中进行构建，然后把表单的各种值以Key=Value数组的形式传入，借此可以封装成一个函数：
var form=document.createElement("Form");
...
但如果包含的话，文件上传时该tag的属性value是文件的名称，而此属性是只读的不能被赋值：
var fileInput=document.createElement("Input");
fileInput.type="file";
fileInput.name="myName"
fileInput.value="myfile.txt" //此句会出错
这是由于安全的原因，不能被赋值；
这样，表单必须做正常形式，target指向IFrame的name。

getResponse:function(msg){
    this.responseText=msg;
    this.HandleResponse.call(this);
    //调用用户传入的回调函数
   }

7.服务器端程序的撰写。主要是向IFrame提交一个可自动运行的网页：



<script LANGUAGE="JavaScript">

</script>