表单的伪异步提交(文件的无刷新上传)

实现原理:利用iframe上传表单.设置表单的target为iframe的ID.

实例:将表单frm无刷新提交

<form id="frm">
    <input name="name" type="text" />
    <input id="f1" name="f1" type="file" onkeydown="return false" onkeyup="return false"/> <input id="Button1" type="button" onclick="SubData();" value="单击提交" />
 </form>

实现脚本:

  function AjaxSubmit(action, formID, data, callback) {
            var frm = document.getElementById(formID);
            frm.method = "post";
            frm.encoding = "multipart/form-data";
            frm.action = action;
            var iframeID = formID + "_AjaxIFrame";
            frm.target = iframeID;
            var childnode = document.getElementById(iframeID);
            var ifrm;
            if (childnode != null && childnode != undefined) {
                frm.removeChild(childnode);
            }
            if (!false) {//if no iframe
                var isIE = ! -[1, ];
                ifrm = document.createElement("iframe");
                ifrm.id = iframeID;
                ifrm.name = iframeID;
                ifrm.style.display = "none";
                ifrm.target = "_parent";
                ifrm.name = iframeID;
                frm.appendChild(ifrm);

                if (isIE) {
                    if (document.frames) {
                        window.frames[iframeID.toString()].name = iframeID;
                    }
                }
                var call = document.getElementById("callback");
                if (!call) {
                    call = document.createElement("input");
                }
                call.name = "callback";
                call.id = "callback";
                call.value = callback;
                call.type = "hidden";
                frm.appendChild(call);
            }
            for (var name in data) {
                var input = document.getElementById(name);
                if (!input) {
                    input = document.createElement("input");
                }
                input.name = name;
                input.id = name;
                input.value = data[name];
                input.type = "hidden";
                frm.appendChild(input);
            }
            frm.submit();
        }

 //---------------

function SubData() {
            //var fileName = document.getElementById("f1").value;
             
            AjaxSubmit("AjaxSubForm", "frm", { sex: 13 }, function (data) {
                alert(data);
            });
        }