单击 jQuery 按钮内的 span答案

【问题标题】：Click span inside jQuery button单击 jQuery 按钮内的 span
【发布时间】：2013-02-16 22:14:54
【问题描述】：

作为更大解决方案的一部分，我有手风琴式的 jQuery 控件，它将标题实现为 jQuery 切换按钮。每个标题还必须有一个帮助气球。简而言之，设置类似于this jsFiddle 上发布的设置。

<div id="button1">Go to main action <span id="span1" style="color:blue">Help</span>     </div>
<div id="out"/>
$('#button1').button().click(function(){
    $('#out').text('Button clicked');
});

$('#span1').click(function(){
    $('#out').text('Span clicked');
});

是否可以这样做，以便我可以单击位于按钮 div 内的帮助范围？或者，按钮是否总是会获取其所有内容的事件，以防止内部元素获取点击事件？

谢谢。

【问题讨论】：

标签： javascript jquery jquery-ui

【解决方案1】：

您的事件首先在span 上触发，然后也在button 上触发。您可以通过stopPropagation() 方法防止在父级上触发事件。此外，return false 也这样做。

Fiddle for demonstration

$('#span1').click(function(e){
    $('#out').text('Span clicked');
    e.stopPropagation();
});

【讨论】：

【解决方案2】：

或：

$('#span1').click(function(){
    $('#out').text('Span clicked');
    return false;
});

jSfiddle http://jsfiddle.net/kxntf/5/

【讨论】：