jQuery 更改输入类型 =“文件”的方法
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2721250/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery change method on input type="file"
提问by gurun8
I'm trying to embrace jQuery 100% with it's simple and elegant API but I've run into an inconsistency between the API and straight-up HTML that I can't quite figure out.
我试图通过它简单而优雅的 API 100% 接受 jQuery，但我遇到了 API 和直接 HTML 之间的不一致，我无法弄清楚。
I have an AJAX file uploader script (which functions correctly) that I want to run each time the file input value changes. Here's my working code:
我有一个 AJAX 文件上传程序脚本（功能正常），我想在每次文件输入值更改时运行该脚本。这是我的工作代码：
<input type="file" size="45" name="imageFile" id="imageFile" onchange="uploadFile()">
When I convert the onchangeevent to a jQuery implementation:
当我将onchange事件转换为 jQuery 实现时：
$('#imageFile').change(function(){ uploadFile(); });
the result isn't the same. With the onchangeattribute the uploadFile()function is called anytime the value is changed as is expected. But with the jQuery API .change()event handler, the event only fires the first time a value is change. Any value change after that is ignored. This seems wrong to me but surely this can't be an oversight by jQuery, right?
结果不一样。使用该onchange属性，该uploadFile()函数在值按预期更改的任何时候都会被调用。但是对于 jQuery API.change()事件处理程序，该事件仅在值第一次更改时触发。之后的任何值更改都将被忽略。这对我来说似乎是错误的，但这肯定不是 jQuery 的疏忽，对吧？
Has anyone else encountered the same issue and do you have a workaround or solution to the problem other than what I've described above?
有没有其他人遇到过同样的问题，除了我上面描述的之外，您是否有解决问题的方法或解决方案？
回答by Luis Melgratti
is the ajax uploader refreshing your input element? if so you should consider using .live() method.
ajax 上传器是否正在刷新您的输入元素？如果是这样，您应该考虑使用 .live() 方法。
$('#imageFile').live('change', function(){ uploadFile(); });
update:
更新：
from jQuery 1.7+ you should use now .on()
从 jQuery 1.7+ 你现在应该使用 .on()
$(parent_element_selector_here or document ).on('change','#imageFile' , function(){ uploadFile(); });
回答by macio.Jun
As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live(). Refer: http://api.jquery.com/on/
从 jQuery 1.7 开始，不推荐使用 .live() 方法。使用 .on() 附加事件处理程序。旧版本 jQuery 的用户应该优先使用 .delegate() 而不是 .live()。参考：http: //api.jquery.com/on/
$('#imageFile').on("change", function(){ uploadFile(); });
回答by rodney hise
I could not get IE8+ to work by adding a jQuery event handler to the file input type. I had to go old-school and add the the onchange=""attribute to the input tag:
我无法通过向文件输入类型添加 jQuery 事件处理程序来使 IE8+ 工作。我不得不去老派并将onchange=""属性添加到输入标签：
<input type='file' onchange='getFilename(this)'/>
function getFileName(elm) {
var fn = $(elm).val();
....
}
EDIT:
编辑：
function getFileName(elm) {
var fn = $(elm).val();
var filename = fn.match(/[^\/]*$/)[0]; // remove C:\fakename
alert(filename);
}
