Как освободить дочерний элемент от события нажатия

Question

Может кто-нибудь помочь мне с этим. Есть HTML код:

<h3>
    <label>
        <input type="checkbox" name="country" value="us" /> United States
    </label>
</h3>
<p>Some content goes here</p>

Я хочу переключать элемент p , нажимая на тег h3 , но я не хочу переключаться, если щелкнул ярлык

$('h3').click(function() {
   // Does something goes here?
   $(this).next('p').toggle();
}

Answer 1

Вам необходимо проверить цель действия

$('h3').click(function(e) {
   // if they clicked the h3 only
   if (this == e.target) {
     $(this).next('p').toggle();
   }
}

Предложение altCognito также будет работать, но это больше кода.

Answer 2

Вы хотите остановитьPropagation ()

$('h3').click(function() {
   // Does something goes here?
   $(this).next('p').toggle();
}
$('label').click(function(e) {
   e.stopPropagation();
}