从元素的子元素中删除特定的事件处理程序

在我的应用程序中，我想在用户单击面板标题时调整窗口大小，但该标题包含一个子元素按钮，该子元素按钮上绑定了另一个事件处理程序。我需要做的是，当用户点击该按钮时，不会调用任何调整大小的函数。我尝试了许多变化，但都没有工作。从元素的子元素中删除特定的事件处理程序

HTML：

<div class="panel-heading" style="cursor:pointer"> 
    <div class="pull-right"> 
     <button type="button" class="btn btn-danger btn-xs" id="btn-subject-remove"><span class="glyphicon glyphicon-remove"></span> Remove</button> 
    </div> 
</div>

我的JQ是：

$('#btn-subject-remove').on('click',btnRemoveSubjectsClick); 
$('#subscribers-row .panel-heading').on('click',btnResizeClick);

我都试过了，但他们没有工作：

$('#subscribers-row .panel-heading').off('click','#btn-subject-remove',btnResizeClick); 
$('#btn-subject-remove').off('click',btnResizeClick); 
$('#subscribers-row .panel-heading').on('click',btnResizeClick).children().click(function(e){return false});

我也试过在btnResizeClick检查函数什么元素被点击，如果它是删除按钮然后返回假，但点击的元素仍然是面板标题

有什么建议吗？

来源

2015-10-16 peter.cambal

请参见[56， “问题‘’包括在他们的头衔？” 标签（http://meta.stackexchange.com/questions/ 19190/should-questions-include-tags-in-titles），其中共识是“不，他们不应该”！ –

绑定儿童的点击事件并使用e.stopPropagation()来阻止父级点击事件。

在一个简单的例子：

$(function() { 
 
    $('div').on('click', function() { 
 
     $(this).toggleClass('redBg'); 
 
    }); 
 
    $('div>*').on('click', function(e) { 
 
     e.stopPropagation(); 
 
    }); 
 
});

div { 
 
    background: green; 
 
    width: 200px; 
 
    height: 200px; 
 
} 
 
span { 
 
    display: block; 
 
    height: 50px; 
 
    background: yellow; 
 
} 
 
.redBg { 
 
    background: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    With some text 
 
    <span> in a span </span> 
 
</div>

来源

2015-10-16 14:28:13 LinkinTED

从元素的子元素中删除特定的事件处理程序

回答

相关问题