stoppropagation на div внутри таблицы не работает

Question

Когда нажата кнопка div внутри таблицы, stoppropagation не запускается до тех пор, пока после щелчка пузырьков на tr. Как прекратить выходить из div?

http://jsfiddle.net/tcbnW/ диктует мой вопрос

DIV кликали! → tr нажал! → СТОП срабатывает

мне нужно

ДИВ щелкнул! → СТОП срабатывает

HTML-код

<table> 
    <tr onclick="$('#INFO').append('tr clicked!<BR>');"> 
     <td> 
      <div onclick="$('#INFO').append('div clicked!<BR>');" style="font-weight:bold;" class="STOP">test div</div> 
     </td> 
    </tr> 
</table> 
<div id="INFO" style="border:1px solid #F00;"></div> 

сценария

$(document).on('click','.STOP',function(event){ 
     $('#INFO').append('STOP triggered<BR>'); 
     event.stopPropagation(); 
     }); 

с помощью JQuery 1,9

Answer 1

попробовать удалить событие OnClick от дел. В основном у вас есть 2 слушателя для одного и того же события, которое встроено в onclick, а второе - $ (документ) .on

Посмотрите на это: [ссылка] http://jsfiddle.net/tcbnW/1/. Это одно дополнение

event.stopImmediatePropagation(); 

Я думаю, что это должно сработать.

Answer 2

Вы не должны смешивать обработку «традиционных» событий (onfoo) и «современную» обработку событий (используя addEventListener и т. Д.), Как это делает jQuery - непредвиденные результаты.