jquery：将事件更改为在IE上input文件
我已经看了四周，并找不到解决scheme：我有一个表单上传文件，它应该在文件select后触发提交。
在FF / Chrome上，它会变得很糟糕，并在文件select后提交表单，但我不能这样做，即。
已经尝试点击/ propertychange，但没有任何反应。 我已经尝试了一些代码：
$("#attach").attr("onChange", "alert('I changed')");
$("#attach").live($.browser.msie? 'propertychange': 'change', function(e) { ... });
我尝试的任何要求？
编辑1：我觉得有一个重要的信息，这个input文件，是dynamic创build的，因为它使用.live（）来绑定事件
我知道这是晚了几个月，但我碰到了在IE7中完全相同的行为; 在所有其他浏览器中，文件input的更改事件发生在文件select后。 在IE7中，只有当你再次触发文件select或模糊时才会发生。
以下是我如何修复它：
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); }
从技术上讲，你可以/应该过滤黑客条件只是IE7，因为IE8的行为正确的变化事件，但它也有同样的行为，IE7暂停超时浏览器相关的铬是可见的（我想它认为它阻止I / O），所以它的工作原样。
这真的很晚，但我遇到了同样的问题，我通过使用带有轻微解决方法的Firefox <label>标签来解决此问题。
http://jsfiddle.net/djibouti33/uP7A9/
目标：
- 允许用户使用标准的html文件input控件上传文件
- 隐藏标准的html文件input控件并应用自己的样式
- 用户selectfile upload后，自动提交表单
浏览器：
- Firefox，Chrome，IE8 / 9，Safari
- IE7没有工作，但如果您将该浏览器添加到底部详细说明的解决方法，可能会失败
初步解决scheme：
- 通过将其置于屏幕外来隐藏文件input。 重要的是不要显示：没有一些浏览器不会这样。
- 向页面添加另一个样式元素（链接，button）。
- 听取对该元素的点击，然后以编程方式向文件input发送点击以触发本地“文件浏览器”
- 监听文件input的onchange事件（在用户select文件后发生）
- 提交表单
问题：
- IE浏览器：如果以编程方式将点击发送到文件input以激活它（2），以编程方式提交表单（5）将会引发安全错误
解决方法：
- 同上
- 利用内置于标签中的辅助function（点击标签将激活相关的控件），通过标签而不是链接/button
- 监听文件input的onchange事件
- 提交表单
- 由于某些原因，Mozilla浏览器不会通过点击来激活文件input。
- 对于Mozilla，听取标签上的点击并向文件input发送点击事件以激活它。
希望这可以帮助！ 查看jsfiddle，了解html / js / css的使用情况。
格式化如下：
$("#attach").change(function() { alert('I Changed'); });
更新：在回答这个问题之前，我们意识到这是作为jQuery 1.4.2事件重写的一部分而被修复的，只是更新到最新版本，以解决<input type="file" />在IE中。
我使用了以下解决scheme。 我试图使其尽可能独立。
(function($) { if ($.browser.msie == false) return; $('input[type=file]').live('click', function(e) { var self = this; var blur = function() { $(self).blur(); } setTimeout(blur, 0); }); })(jQuery);
这一直在IE6和IE7中工作。
$('#id-of-input-type-file').change(function(){});
我遇到了与IE相同的问题（包括IE 9）。 UI逻辑是：
- 点击
div元素触发file-input-element上的click事件，以便用户点击div触发器文件打开对话框 - 将
change事件处理程序绑定到file-input-element以确保在文件打开对话框closures时提交form
该应用程序（在iframe中运行）就像Chrome和FF上的魅力一样。 但很快我发现它不能在IE上工作，因为当用户select一个文件，并closures表单没有提交的对话框。
最终的解决scheme是放下逻辑＃1“点击文件input元素上的div元素触发click事件”，让用户直接点击file input element ，然后工作。
顺便说一句，我们有一个div元素的原因是我们想要隐藏浏览器呈现的控件，因为我们拥有背景图像中的所有东西。 但是，如果将display设置为none ，则控件无法响应用户交互事件。 所以我们将file-input-element移动到视图端口的外部，并使用div元素来replace它。 由于这在IE上不起作用，所以我们最终将file-input-element移回，并将其设置为opacity为0.在不支持opacity IE 8或更低版本中，我们使用filter使其透明：
#browse { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
我发现这个解决scheme在HTML中隐藏文件元素（不要使用display：none，不会在IE中工作），准备IE的onchange事件：
<div style="width: 0px; height: 0px; overflow: hidden;"> <input id="ifile_template" type="file" onchange="this.focus(); this.blur();"/> </div>
在javascript中为IE绑定function模糊，而对于FF，CH绑定function改变（）：
$(iFile).blur( function () { ...some code... } ); // FF, CH $(iFile).change( function () { ...some code... } );
在IE的onchange事件工作正常，当它直接填写在HTML标签。 喜欢：
<input type="file" onchange="uploader.upload()" />
对于IE你可以使用“onfocus”事件来捕捉上传文件的变化。 一旦文件浏览对话框closures，onfocus事件被触发。 您可以通过将此行添加到您的页面来检查：
<input type="file" onfocus="javascript:alert('test');" />
一旦对话框closures，就会显示警告消息。
这个解决scheme只适用于IE，不适用于FF或Chrome。
我的解决scheme
setInterval(function() { if ($.browser.msie) $("input[type=file]").blur(); },500);
不漂亮，但它的作品。 ; d
这可能是一个与input字段在IE中的竞争条件的问题 。 通过使用setTimeout，被执行的函数将注册一个变化发生。 当在onChangeEvent中执行UI代码时，该事件还没有被触发，因为它看起来像IE。
我通过在我的更改处理程序中执行以下操作来解决类似的情况：
if (jQuery.browser.msie) { setTimeout(DoSomeUIChange, 0); } else { DoSomeUIChange(); }
DoSomeUIChange在事件队列上的当前代码之后执行，因此消除竞争条件。
我可以确认，至less它只在模糊事件发生后才起作用，类似于IE中的收音机和checkbox。 我可能会添加一些视觉元素，让用户点击并告诉我他们什么时候select了他们的文件。
瘸。
$("#attach").attr("onChange", "alert('I changed')");
它可以在IE中使用，但是如果你想模拟“live”行为，你应该在创build它的时候为每个新元素添加“onChange”属性。
jQuery似乎无法识别propertychange事件。 我使用IE的attachEvent()将其添加到DOM节点。
var userChoseFile = function($input) { // ... } var $input = $(/* your file input */); $input[0].attachEvent('onpropertychange', function() { userChoseFile($input); });
看这些小提琴http://jsfiddle.net/uP7A9/531/
HTML：
<input type="file" name="PicturePath" id="fileUpload" accept=".png,.jpg,.jpeg,.gif,.tif" />
jQuery的：
$("input[type=file]#fileUpload").on("change", function () { alert('hi') });
它适用于所有浏览器，testing。
