使用Javascript进行文件上传会将带有样式化的“拒绝访问”错误返回到按钮

我使用以下程序化了My ​​File输入：

   #yourBtn{ position: relative; top: 150px; font-family: calibri; width: 150px; padding: 10px; border-radius: 5px; border: 1px dashed #ddeeff; text-align: center; background-color: #ffddee; cursor:pointer; color:#333333; }   function getFile(){ document.getElementById("upfile").click(); } function sub(obj){ document.getElementById("yourBtn").innerHTML = "Uploading Please Wait..."; document.myForm.submit(); event.preventDefault(); }     
 
click to upload a file
 
 
     

问题是.submit（）函数返回IE上的“拒绝访问”错误（在IE8和9中测试）。 适用于所有其他浏览器（chrome，opera，safari和Firefox）。 当调用sub（obj）时。 即使我也使用Jquery，也会发生同样的事情。

那么任何人都可以告诉我如何让这个脚本在IE上运行？

Answer 1

如上所述，IE不允许您打开对话框并代表用户通过javascript提交文件。 话虽这么说，你设计“文件输入”的想法是完全有效的。

此链接可以帮助您：

样式文件输入

至少可以说这是一个错误的工作，但一般的要点是：

1. 创建文件输入并使用css将不透明度设置为0.0。 不设置可见性，因为这将禁用输入。
2. 使用CSS为您喜欢的常规文本输入设置样式，使其看起来像您想要的文件输入。
3. 定位文本输入并添加z-index为0。
4. 定位文件输入（完全透明）并将z-index设为1。

5. 编写javascript来拉取文件输入的值（即在jQuery中

    $('input[type="file"]').val(); 

   并将其放在文本输入中。

这里的想法是文件输入仍在拉动文件，用户仍在选择文件。 从某种意义上说，你掩盖它并使它看起来好像你有一个自定义控件。 真的，你的虚假控制背后是真正的控制，它只是透明的。

希望这可以帮助

Answer 2

这永远不会奏效。 IE不允许您通过javascript调用“选择文件”对话框并通过javascript提交相关表单。 如果您尝试这样做，正如您所见，IE将在表单提交时抛出错误。 您必须允许用户自己单击输入元素。