Распространение события клика Jquery

У меня есть таблица с событиями кликов, привязанными к ее строкам (<tr>). Внутри этих строк есть <a> элементов с назначенными им событиями щелчка.

Проблема в том, что когда я нажимаю на элемент <a>, он также запускает событие щелчка от родительского элемента <tr>. Я не хочу такого поведения; Я просто хочу запустить событие клика <a>.

Код:

 // Event row TR

 $("tr:not(:first)").click(function() {
    $(".window, .backFundo, .close").remove();

    var position = $(this).offset().top;
    position = position < 0 ? 20 : position;

    $("body").append( $("<div></div>").addClass("backFundo") );
    $("body").append( $("<div></div>").addClass("window")
         .html("<span class=close><img src=Images/close.png id=fechar /></span>")
      .append( "<span class=titulo>O que deseja fazer?</span>"
              +"<span class=crud><a href=# id=edit>Editar</a></span>"
              +"<span class=crud><a href=# id=delete codigo=" 
              + $(this).children("td:first").html() 
              + ">Excluir</a></span>" )
       .css({top:"20px"})
       .fadeIn("slow") );

    $(document).scrollTop(0);
 });

 // <A> Element event

 $("a").live("click",function() { alert("clicked!"); });

Всякий раз, когда вы нажимаете якорь, он запускает событие из родительской строки. Любые идеи?


events click jquery
person ozsenegal    schedule 11.02.2010    source источник

Ответы (2)


arrow_upward
27
arrow_downward

Вы должны остановить всплытие событий. В jQuery вы можете сделать это с помощью

e.stopPropagation();

в событии onclick тега привязки.

$("a").live("click",function(e){alert("clicked!");e.stopPropagation();});

Изменить

Смотрите этот пост

jquery Event.stopPropagation() не работает< /сильный>

person rahul    schedule 11.02.2010
comment
У меня есть обычная таблица. Затем я автоматически создаю новые элементы привязки и добавляю их к этим строкам. - person ozsenegal; 11.02.2010
comment
Попробуйте дать return false в конце обработчика события привязки. - person rahul; 11.02.2010
comment
Добавьте туда также e.preventDefault(); для хорошей меры, существует некоторое несоответствие браузера между предотвращением распространения. - person Nick Craver; 11.02.2010
comment
return false, а также e.preventDefault() предотвратят действие щелчка по умолчанию (переход на связанную страницу), что, очевидно, не то, чего хочет ОП. - person Antony Hatchkins; 26.07.2011

arrow_upward
4
arrow_downward

Я бы использовал bind вместо live для <tr> и <a> и следующий код

$("a").bind("click", function(e){ alert("clicked!"); e.stopPropagation() });

для <a>.

Все <a href> будут работать должным образом, а код обработчика событий <tr> не будет выполняться после нажатия <a>.

Работает во всех современных браузерах.

person Antony Hatchkins    schedule 26.07.2011