変更イベントは1回ではなく2回トリガーされます

Question

私はこのhtml5ファイルアップローダープラグインで作業していますが、理解できないバグがあります。

jsfiddle link

このプラグインのアイデアは、それをクリックするだけで対象のボタンに機能の基を結合することです。

しかし、私は「ボタン-1」にクリックイベントをクリックすると、「ボタン-2」クリックイベントがon change eventが起こっていると同時に、トリガーされました。私はchangeイベントが2回トリガされているに違いないと思います。

アップロードボタンをクリックして、私が何を意味するのかを試すことができます。

このプラグインで何が問題になるのでしょうか？

(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); 

Answer 1

はあなたのコードの私のバリアントをチェック：http://jsfiddle.net/es8Vh/3/ 基本的なjQueryプラグイン構造：この答え、dfsqため

$.fn.pluginName = function() { 
    return this.each(function() { // <-- this is important 
     // code here 
    }); 
};