使用click(),Javascript和文件上传无法正常工作

Question

我在javascript中创建一个上传控件,然后element.click()用于调出文件浏览器对话框.

    function add(type) {            
        var element = document.createElement("input");
        element.setAttribute("type", type);
        element.setAttribute("value", type);
        element.setAttribute("name", type);            
        element.setAttribute("id", "element-" + i);
        var removebutton = document.createElement('a');
        var removeimage = document.createElement('img');
        removeimage.setAttribute("width", 15);
        removeimage.setAttribute("height", 15);
        removeimage.setAttribute("class", "removebutton");                                                
        removeimage.src = "/Content/Images/redx.png";            
        removebutton.appendChild(removeimage);
        removebutton.setAttribute("id", "remove-" + i);
        removebutton.setAttribute("onclick", "remove(" + i + "); return 0;");
        var newfile = document.getElementById("uploadhere");
        //newfile.appendChild(removebutton);
        newfile.appendChild(element);
        newfile.appendChild(removebutton);
        element.click();
        i++;                     
    }

文件broswer对话框按预期出现,但在我选择表单上的提交后,任何文件都输入到控件消息中.

如果我单击"浏览",我会收到文件broswer对话框,但文件上传正确.

如何将文件上载控件添加到我的表单,并让它显示文件broswer对话框,仍然按预期工作.

Answer 1

Firefox 是唯一允许这样做的浏览器。Chrome、safari 和 Opera 一开始就不允许这样做，而 IE 只是愚弄你，它可以但实际上不会提交以这种方式选择的文件。

我会通过完全删除.click()并在先前输入的情况下添加新文件输入来解决change此问题，这样就不需要为每个新文件单击两次（添加输入+然后打开对话框）。示例http://jsfiddle.net/APstw/1/

另请参阅jQuery：模拟单击 <input type="file" /> 在 Firefox 中不起作用？