jQuery ~ Два клика наложены?

Question

У меня есть элемент контейнера, скажите

<div id="myContainer">
  <form action="" method="post">
   Radio: <input type="radio" name="myRadio" id="myRadio" value="1" />
  </form>
</div>

Итак, если я назначу событие click для $('#myContainer'), а также событие click для $('#myRadio'), есть ли способ заставить их обоих выстрелить? В настоящее время из-за события щелчка «над» элементом формы, у которого есть return false для остановки перехода на страницу, я не могу щелкнуть переключатель.

Есть ли способ справиться с этим? Или мне нужно быть более конкретным в моих селекторах? Или даже $('#myContainer:not("#myRadio")')? (это даже верно?)

Answer 1

Вы можете сделать следующее!

$('#myContainer, #myRadio').click(function(event){

    event.stopPropagation(); //This will stop the bubble so it only fires once per element
    switch(event.srcElement)
    {
        case 'HTMLFormElement':
            //The Div / Form
        break;
        case 'HTMLInputElement':
            //The input itself
        break;   
    }
    return false;
})​

Пример Здесь , Вам нужно будет добавить оповещения

Answer 2

Чтобы остановить переход по страницам, используйте event.preventDefault() вместо return false;, который в настоящее время останавливает событие в мертвых дорожках.

Естественное поведение для событияк пузырю , поэтому все, что вам нужно сделать для запуска обоих обработчиков, это не мешать пузырю через return false:)