文件上传使用JavaScript返回“拒绝访问”错误程式化 一个按钮(File Upload

2019-07-18 20:14发布

我已经程式化使用我的文件输入:

<html>
<head>
<style>
#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;
}
</style>
<script type="text/javascript">
 function getFile(){
document.getElementById("upfile").click();
 }
 function sub(obj){
 document.getElementById("yourBtn").innerHTML = "Uploading Please Wait...";
 document.myForm.submit();
 event.preventDefault();
 }
</script>
</head>
<body>
<center>
<form action="/sub/upload.php" method="POST" enctype="multipart/form-data" name="myForm" target="myiframe">
<div id="yourBtn" onclick="getFile()">click to upload a file</div>
<div style='height: 0px;width: 0px; overflow:hidden;'><input id="upfile" type="file" name="upload" style="display:none;" onchange="sub(this)" /></div>
</form>
<iframe name="myiframe" style="width:100;height:100;border:2px solid #bbccdd;"></iframe>
</center>
</body>
</html>

问题是.submit()函数返回上IE的访问被拒绝的错误(在IE8测试和9)。 工程在所有其他浏览器(铬,歌剧,Safari和Firefox)的罚款。 当子(OBJ)被调用。 而同样正在发生的事情,即使我使用jQuery也。

因此,任何一个可以告诉我,我应该怎么得到这个脚本在IE浏览器的工作?

Answer 1:

正如上面提到的IE不允许你打开对话框,并通过JavaScript代表用户提交的文件。 话虽这么说,你的造型的“文件输入”的想法是完全有效的。

此链接可以帮你:

样式文件输入

这是一个有错误的解决办法,至少可以说,但一般的要点是:

  1. 创建一个文件的输入和使用CSS 0.0设置不透明度。 不要设置知名度,因为这将禁用输入。
  2. 样式使用CSS,使它看起来像你想要的文件输入一个普通的文本输入自己的喜好。
  3. 文本输入位置,并添加0的z-index。
  4. 您的文件输入位置(即完全透明),并给它1的z-index。
  5. 编写JavaScript拉文件输入的值(即jQuery中

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

    并将其放置在文字输入。

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

希望这可以帮助



Answer 2:

这行不通。 IE不会让你通过JavaScript调用“选择文件”对话框,并通过javascript提交相关表格。 如果你这样做,正如你所看到的,IE会扔在表单提交错误。 你必须允许用户点击输入元素本身。



文章来源: File Upload Using Javascript returns 'Access Denied' Error With Stylized to a button