确定哪些子元素是由父事件处理程序点击

Question

两个click处理函数

$('#current_options').on('click', 'td', function(){ 
    $('#product_options_list tbody').css('display', 'none'); 
    $('.sub_options tbody').css('display', ''); 
    var my_id = $(this).parent().find('input').val(); 
    $('#product_options_list thead').css('display', ''); 
    $('#product_options_list tbody#'+my_id).css('display', ''); 
}); 

$('#current_options').on('click', '.icon-minus-sign', function(e){ 
    e.preventDefault(); 
    var rem_id = $(this).parent().find('input').val(); 

    //remove corresponding option values 
    $('#product_options_list tbody#'+rem_id).remove(); 

    //either highlight next options values or hide table header if no other values present   
    $('#product_options_list thead').css('display', 'none'); 
    $(this).parent().parent().remove(); 


}); 

HTML

<table id="current_options" class="table"> 
    <tbody> 
     <tr> 
     <td> 
      Size<i class="icon-minus-sign"></i> 
     </td> 

基本上，我想从如果单击处理射击停止对TD的点击处理程序在td里面我点击。

Answer 1

我认为你正在寻找jQuery的stopPropagation()，就像这样：

$('#current_options').on('click', '.icon-minus-sign', function(e){ 
    .. 
    e.stopPropagation(); 
}); 

Answer 2

您需要stopPropagation这样的：

$('#current_options').on('click', '.icon-minus-sign', function(e){ 
    e.preventDefault(); 
    e.stopPropagation(); //this stops the event from moving up the parents 

    var rem_id = $(this).parent().find('input').val(); 

    //remove corresponding option values 
    $('#product_options_list tbody#'+rem_id).remove(); 

    //either highlight next options values or hide table header if no other values present   
    $('#product_options_list thead').css('display', 'none'); 
    $(this).parent().parent().remove(); 


}); 

如果您使用.on()或.delegate()然后只是做一个return false;权在你的结尾function

参考：http://api.jquery.com/event.stopPropagation/