jquery – Chrome文件上传错误:更改事件不会同一个文件执行两次

前端之家收集整理的这篇文章主要介绍了jquery – Chrome文件上传错误:更改事件不会同一个文件执行两次前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在使用这个html5文件上传插件,但它在Google Chrome上有一个错误,我无法理解并修复它。它在Firefox上工作正常。

jsfiddle link

问题是您无法从桌面上传相同的文件两次。

当您第一次点击时,选择并点击确定从桌面上传文件,它应该提醒一个消息,例如’.button-1′ – 取决于你点击哪个上传按钮。

那么如果您尝试再次上传相同的文件,这行代码将不会被执行,

  1. $(".upload-file",object_parent).change(function() {
  2.  
  3. ...
  4. ...
  5.  
  6. alert($cm.selector);
  7.  
  8. });

任何想法这个插件出了什么问题?

  1. (function($){
  2.  
  3. // Attach this new method to jQuery
  4. $.fn.extend({
  5.  
  6. // This is where you write your plugin's name
  7. upload_file_html5: function(options) {
  8.  
  9. // Set the default values,use comma to separate the settings,example:
  10. var defaults = {
  11. objectSuperparent: '.media'
  12. }
  13.  
  14. var options = $.extend(defaults,options);
  15. var o = options;
  16.  
  17. var $cm = this.click(function(e){
  18.  
  19. // <a> button is the object in this case.
  20. var object = $(this);
  21.  
  22. // Get other info from the element belong to this object group.
  23. var object_href = object.attr('href');
  24. var object_parent = object.parent();
  25. alert($cm.selector);
  26.  
  27. // Trigger the click event on the element.
  28. // Due to security policies triggering click on the input type=file is not allowed/supported in some browsers and Opera is one of them.
  29. //$('input[type=file]').trigger('click'); // or:
  30. $(".upload-file",object_parent).click();
  31.  
  32. return false;
  33.  
  34. });
  35.  
  36. // Trigger ajax post when ever the file is changed by the user.
  37. var $cm_2 = $(".upload-file").change(function(){
  38.  
  39. // <input> is the object in this case.
  40. var object = $(this);
  41.  
  42. var object_form = object.parent();
  43. var object_superparent = object.parents(o.objectSuperparent);
  44. var path_config = $($cm.selector,object_superparent).attr('href');
  45. var path_post = object_form.attr('action');
  46.  
  47. alert($cm.selector);
  48. //alert(path_config);
  49.  
  50. ....
  51. ....
  52.  
  53. });
  54.  
  55. }
  56. });
  57.  
  58. })(jQuery);

Chrome可以正常工作,但最近刚刚失败,可能Chrome已将最新版本更新到我的机器,此更新会导致错误

解决方法

是。我的Chrome对Firefox有不同的行为,但我认为Chrome是正确的。

根据W3C’s document

onchange event occurs when a control loses the input focus and its value has been modified since gaining focus

如果您尝试上传相同的文件文件输入的值不会更改。尝试打印出来:

  1. $('.button-2').click(function(){
  2. console.log($(".list .upload-file").val())
  3. return false;
  4. });

猜你在找的jQuery相关文章