Захват события с помощью jquery

Question

Я получил двойное событие для управления. Оба события являются "щелчками" и обрабатываются с помощью jquery. HTML является следующим:

 <div class="siteMap"  style="width:23%;">
            <h5>Divisione Anticontraffazione</h5>
            <span class="menufooter">
            <span class="link1"><a href="#scheda1">Introduzione</a></span><br>
            <span class="link2"><a href="#scheda2">Filosofia</a></span><br>
            <span class="link3"><a href="#scheda3">Negozio online</a></span></span><br>
        </div>

Затем у меня есть события щелчка, которые запускаются внутри диапазона нижнего колонтитула и внутри каждого диапазона ссылок. Код выглядит так:

$(document).ready(function() {
    $('span.menufooter').click(function() { 
        //my code here
    });
    $("span.link1").click(function() {
       //my code here
    });
});

Мне нужно действие захвата событий, щелчок по нижнему колонтитулу диапазона должен инициировать событие до того, как щелчок по ссылке span1 сработает. На данный момент, ни одно из двух событий не происходит. Любой намек?

Answer 1

Вы могли бы предотвратить всплывание клика, а затем вызвать клик на родительском элементе, чтобы все, что находится в этом обработчике, выполнялось первым (если оно не асинхронно).

$(document).ready(function () {
    $('.menufooter').click(function () {
        // fires before ....
    });

    $("span.link1").click(function (e) {
        e.stopPropagation();
        $('.menufooter').trigger('click');
        // .... this fires, as it's triggered above
    });
});

FIDDLE

Answer 2

Как насчет только пожара на .menufooter

$(document).ready(function() {
    $('span.menufooter').click(function(e) { 
        //my code here 1

        // Capture Event Propagation
        if ( $("span .link1").find(e.target).length>0 ){
           //my code here 2
        };
    });
});

http://jsfiddle.net/9QLtG/

Answer 3

Попробуй это event.stopPropagation();

 $("span.link1").click(function(event) {
     event.stopPropagation();
       ...
 });

Answer 4

Я хотел бы иметь 1 слушатель щелчка, который слушает обертку. Вы можете проверить цель события, чтобы увидеть, действительно ли они нажали на ссылку и запустить соответствующий код.

Например:

$(document).ready(function() {

    $('.container').click(function(e) {

        // Perform action when they clicked in the main wrapper,
        // regardless of whether or not it was a link.
        console.log("I clicked in the wrapper...");

        if ($(e.target).hasClass('link')) {
           // Perform action if they clicked on a link.   
           console.log("...but more specifically, on a link.");
        }
    });

});

Вот скрипка, которая демонстрирует это: http://jsfiddle.net/WaYFr/