Jquery:将事件更改为IE上的输入文件

Question

我已经四处寻找了,找不到解决方案:我有一个表单来上传文件,它应该在文件选择后触发提交.

在FF/Chrome上它会变形,并在文件选择后提交表单,但我不能在ie上执行此操作.

已经尝试过click/propertychange但没有任何反应.我已经尝试了一些代码:

.live()

.live()

我尝试过任何消化措施吗？

Edit1:我认为有一个重要的信息,这个输入文件是动态创建的,因为我使用.live()来绑定事件

Answer 1

我知道这已经晚了几个月,但我在IE7中遇到了完全相同的行为; 在所有其他浏览器中,文件输入的更改事件发生在文件选择之后.在IE7中,仅当您再次触发文件选择或模糊时才会发生这种情况.

以下是我最终修复它的方法:

var $input = $('#your-file-input-element');

var someFunction = function()
{
    // what you actually want to do
};

if ($.browser.msie)
{
    // IE suspends timeouts until after the file dialog closes
    $input.click(function(event)
    {
        setTimeout(function()
        {
            if($input.val().length > 0) {
              someFunction();
            }
        }, 0);
    });
}
else
{
    // All other browsers behave
    $input.change(someFunction);
}

从技术上讲,你可以/应该将hack条件过滤到IE7,因为IE8在更改事件上表现正常,但是在挂起超时时它也具有与IE7相同的行为,而浏览器相关的chrome是可见的(我猜它认为它阻止我/ O),所以它按原样工作.

Answer 2

这真的很晚了,但是我遇到了同样的问题,我通过使用<label>带有针对Firefox的轻微解决方案的样式标签解决了这个问题.

http://jsfiddle.net/djibouti33/uP7A9/

目标:

1. 允许用户使用标准的html文件输入控件上传文件
2. 隐藏标准的html文件输入控件并应用自己的样式
3. 用户选择要上传的文件后,自动提交表单

浏览器:

• Firefox,Chrome,IE8/9,Safari
• IE7不起作用,但如果您将该浏览器添加到底部详细的解决方法中可能会有效

初始解决方案:

1. 通过将其放在屏幕外来隐藏文件输入.重要的是不要显示:none,因为有些浏览器不喜欢这个.
2. 向页面添加另一个样式元素(链接,按钮).
3. 听取对该元素的单击,然后以编程方式将单击发送到文件输入以触发本机"文件浏览器"
4. 侦听文件输入的onchange事件(在用户选择文件后发生)
5. 提交表格

问题:

1. IE:如果您以编程方式将单击发送到文件输入以激活它(2),以编程方式提交表单(5)将引发安全性错误

解决方案解决方案:

1. 与上述相同
2. 通过设置标记而不是链接/按钮,利用标记内置的辅助功能(单击标签将激活其相关控件)
3. 侦听文件输入的onchange事件
4. 提交表格
5. 出于某种原因,Mozilla浏览器不会通过单击来激活文件输入.
6. 对于Mozilla,请监听标签上的单击并将单击事件发送到文件输入以激活它.

希望这可以帮助!查看jsfiddle,了解用于完成所有工作的html/js/css的详细信息.

Answer 3

格式如下:

$("#attach").change(function() { 
  alert('I Changed');
});

更新:在回答了之前的另一个问题之后,我们意识到这是作为jQuery 1.4.2事件重写的一部分修复的,只是更新到最新版本以解决IE中的change事件问题<input type="file" />.