Chrome 文件上传错误:更改事件不会对同一个文件执行两次 [英] Chrome file upload bug: on change event won't be executed twice with the same file
问题描述
我正在开发这个 html5 文件上传器插件,但它在 Google Chrome 上有一个错误,我无法理解并修复它.它在 Firefox 上运行良好.
I am working on this html5 file uploader plugin but it has a bug on Google Chrome which I can't understand and fix it. It works fine on Firefox.
问题是您无法从桌面上传同一个文件两次.
The problem is that you cannot upload the same file twice from your desktop.
当您第一次点击、选择并点击确定"从桌面上传文件时,它应该会提醒一条消息,例如.button-1" - 取决于您点击的上传按钮.
When you first click, select, and hit OK to upload a file from your desktop, it should alert a message, for instance '.button-1' - depends on which upload button you click.
那么如果你再次尝试上传同一个文件,这行代码就不会再执行了,
Then if you try to upload the same file again, this line of code won't be executed anymore,
$(".upload-file",object_parent).change(function() {
...
...
alert($cm.selector);
});
知道这个插件出了什么问题吗?
Any idea what goes wrong in this plugin?
(function($){
// Attach this new method to jQuery
$.fn.extend({
// This is where you write your plugin's name
upload_file_html5: function(options) {
// Set the default values, use comma to separate the settings, example:
var defaults = {
objectSuperparent: '.media'
}
var options = $.extend(defaults, options);
var o = options;
var $cm = this.click(function(e){
// <a> button is the object in this case.
var object = $(this);
// Get other info from the element belong to this object group.
var object_href = object.attr('href');
var object_parent = object.parent();
alert($cm.selector);
// Trigger the click event on the element.
// Due to security policies triggering click on the input type=file is not allowed/supported in some browsers and Opera is one of them.
//$('input[type=file]').trigger('click'); // or:
$(".upload-file",object_parent).click();
return false;
});
// Trigger ajax post when ever the file is changed by the user.
var $cm_2 = $(".upload-file").change(function(){
// <input> is the object in this case.
var object = $(this);
var object_form = object.parent();
var object_superparent = object.parents(o.objectSuperparent);
var path_config = $($cm.selector,object_superparent).attr('href');
var path_post = object_form.attr('action');
alert($cm.selector);
//alert(path_config);
....
....
});
}
});
})(jQuery);
它在 Chrome 上运行正常,但最近失败了,可能 Chrome 已将最新版本更新到我的机器上,此更新导致了错误?
It was working OK on Chrome but just failed recently, probably Chrome has updated a latest version to my machine and this update causes the bug?
推荐答案
是的.我的 Chrome 与 Firefox 的行为不同,但我认为 Chrome 是正确的.
Yes. My Chrome has different behavior to Firefox, but I think Chrome is correct.
根据 W3C 的文档:
onchange 事件发生在控件失去输入焦点并且其值在获得焦点后被修改时发生
onchange event occurs when a control loses the input focus and its value has been modified since gaining focus
如果你尝试上传同一个文件,文件输入的值不会改变.尝试打印出来:
if you try to upload the same file, the value of file input does not change. Try to print it out:
$('.button-2').click(function(){
console.log($(".list .upload-file").val())
return false;
});
这篇关于Chrome 文件上传错误:更改事件不会对同一个文件执行两次的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!