合并两个类似的单击事件到一个

Question

这是在写我的javascript一个经常性的问题：我的活动：

$(document).on('click','.mi_piace_brick',function(){ 
    $this = $(this).children(), 
    $that = $(this), 
    i = s.get_current_step_id(), 
    j = $that.attr('data-class'), 
    counter = parseInt($('.like_counter_'+i+'_'+j).first().find('p').text()); 

    if($this.hasClass('liked')){ 
     $this.removeClass('liked'); 
    $('.like_counter_'+i+'_'+j).find('p').text(--counter); 
    } 
    else{ 
    $this.addClass('liked'); 
    $('.like_counter_'+i+'_'+j).find('p').text(++counter); 
    } 
    }) 

而且

$(document).on('click','.pref_brick',function(){ 
    $this = $(this).children(), 
    $that = $(this), 
    i = s.get_current_step_id(), 
    j = $that.attr('data-class'), 
    counter = parseInt($('.fav_counter_'+i+'_'+j).first().find('p').text()); 

     if($this.hasClass('preferito')){ 
     $this.removeClass('preferito'); 

     $('.fav_counter_'+i+'_'+j).find('p').text(--counter); 
    } 
    else{ 
     $this.addClass('preferito'); 
      $('.fav_counter_'+i+'_'+j).find('p').text(++counter); 
     } 
     }) 

正如你可以看到，这两个功能基本上真的很相似。在这种情况下我经常遇到。在您看来，有一种方法只使用一种绑定来实现这个诀窍？

Answer 1

将这些元素分配给他们将共享并将单击事件附加到该共享类的类。如果需要区分这两者，请使用元素的数据属性。

<input class="sharedClass" data-parameter="enabled" /> 

$(document).on('click', '.sharedClass', function(eventObject) { 
    eventObject.preventDefault(); 
    if ($(eventObject.target).data('parameter') == 'enabled') { 
     // your logic for "enabled" element 
    } 
});