jquery插件點擊事件

Question

我一直在學習並嘗試通過在線示例和教程來創建自己的jQuery插件。

我有一個在每個表格行上調用的插件，但是我的單擊事件針對表中的每個<tr>運行。

我怎樣才能得到它，所以我的插件的點擊事件只發生在被點擊的<tr>？

的計劃是，一旦我有它正常工作與相關<tr>和按鈕動作需要對數據進行處理的東西也如刪除父<tr>

(function ($) { 
    "use strict"; 

    $.quote = function(el, options) { 
     var base = this; 

     base.options = {}; 

     base.$el = $(el); 
     base.el = el; 

     base.$el.data('quote', base); 

     function debug(e) { 
      console.log(e); 
     } 

     base.init = function() { 
      base.options = $.extend({}, $.quote.defaultOptions, options); 
      //var quotes = ''; 
     }; 

     base.convert = function(e) { 
      debug(e); 
     }; 

     base.ditch = function(e) { 
      debug(e); 
     }; 
     base.updateForm = function(e) { 
      base.options.buttonPress.call(this); 
     } 

     base.init(); 
    }; 

    $.quote.defaultOptions = { 
     buttonPress: function() { 
      alert('hello'); 
     } 
    }; 

    $.fn.quote = function(options) { 
     return this.each(function() { 
      var qt = new $.quote(this, options); 

      $('button[name="convert"]').click(function(e) { 
       qt.convert(e); 
      }); 
      $('button[name="ditch"]').click(function(e) { 
       qt.ditch(e); 
      }); 
      $('.widget td:not(.td-actions)').click(function(e) { 
       qt.updateForm(e); 
      }); 
     }); 
    }; 
})(jQuery); 

$(function() { 
    $('tr').quote(); 
}); 

HTML一些內容更新一些div

<tr> 
    <td></td> 
    <td></td> 
    <td class="td-actions"><button name="convert" class="btn btn-small btn-success"><i class=" fa fa-check"> </i></button><button name="ditch" lass="btn btn-danger btn-small"><i class=" fa fa-remove"> </i></button></td> 
</tr> 

Answer 1

還有其他的事情不是最優的，但解決您的具體問題：您的代碼遍歷所有的TR，然後添加了每個按鈕一個新的事件處理程序 - 爲每行一個事件處理程序（新） - 所以用3排通過這三個循環，然後爲每個OTHER行的按鈕添加一個新的點擊處理程序 - 所有這三個處理都是爲每次點擊處理的。將事件處理程序添加到「this」TR中：

$(this).find('button[name="convert"]').click(function (e) { 
     console.log('convertcall'); 
     qt.convert(e); 
    }); 
    $(this).find('button[name="ditch"]').click(function (e) { 
     console.log('ditchcall'); 
     qt.ditch(e); 
    }); 
    $(this).find('.widget td:not(.td-actions)').click(function (e) { 
     console.log('updateformcall'); 
     qt.updateForm(e); 
    });