Javascript IE需要多次点击提交

我有一个带有文件控件的表单和一个单独的按钮，该按钮会导致在该文件字段上触发单击事件。问题是，如果您单击按钮，那么页面底部的提交按钮需要在IE中单击两次。我如何防止这种情况

以最简单的形式，代码如下：

HTML:

JSFIDLE上更深入的示例：

在IE中，点击“我的选择”按钮需要两次点击“提交”才能真正发布。（通常“myFile”是隐藏的，但出于演示目的，我将其保持可见。）

测试步骤：

• 案例1：
• 刷新页面
• 点击“提交”。确认提交（通过开发工具）
• 案例2：
• 刷新页面
• 单击文件输入旁边的“浏览…”，选择文件
• 点击“提交”。确认提交（通过开发工具）。（有时甚至需要点击两下！）
• 案例3：
• 刷新页面
• 点击“我的选择”，选择文件
• 点击“提交”。没有行动

您还可以看到，在案例2和案例3中，有时也不会触发.click（）或.submit（）事件

---

另一个有趣的方面是当页面上有多个文件输入时。如果有三个，并且您执行了上述三次操作，那么您必须总共四次单击“提交”按钮来提交页面。

解决方案是使用指向文件输入的标签，您可以对标签应用任何样式，它将起作用

<label for="myFile">** My Label **</label><br/>
<input type="file" id="myFile" name="myFile" />

**我的标签**

---

据我所知，这是由IE9安全限制引起的。

在IE10中适用于我。嗯，我在IE11中测试了你的小提琴，它似乎适用于所有3种情况。只需单击“提交”按钮一次。你测试过哪些版本的IE？这很奇怪，因为我使用的IE 10没有扩展，它不允许我提交。

$(function() {
    $('#myButton').click(function(e) {
        e.preventDefault();
        $('#myFile').click();
    });
});

<label for="myFile">** My Label **</label><br/>
<input type="file" id="myFile" name="myFile" />