Span bên Neo với sự kiện bọt

Question

Tôi có một mảnh html:

<li class="addToFriends"><a href="....">Something something<span>INSIDE SPAN</span>something</a></li> 

Để xử lý yêu cầu AJAX khi nhấp vào neo Tôi đã đăng ký xử lý trên nhấp chuột sự kiện:

$('.addToFriends a').click(function(event){ 
    var target = $(event.target); 
    if (target.is('a')) { 
       // if I click on SPAN element following fragment won't execute! 


     // do ajax request 
    }  
    event.preventDefault(); 
}); 

Câu hỏi của tôi là :

• tại sao sự kiện nhấp chuột được nâng lên cho phần tử span? Sau khi tất cả, tôi không liên kết sự kiện nhấp chuột với các phần tử SPAN
• ngoài câu hỏi trước, tôi nghĩ rằng nếu tôi không xử lý sự kiện nhấp SPAN, trình duyệt sẽ sử dụng sự kiện sôi nổi để tăng sự kiện nhấp cho neo (nếu tôi thắng không gọi event.stopPropagation()). Nhưng tôi cũng đã không làm việc ra cho tôi như rằng sự kiện nhấp chuột được nâng lên chỉ một lần

Vì vậy, bây giờ, tôi có vòng vấn đề mà tôi giải pháp của tôi là:

$('.addToFriends a').click(function(event){ 
    var target = $(event.target); 
    if (!target.is('a')) { 
     target = target.parent('a') 
    } 
      ... 
}); 

nhưng vẫn còn, tôi tò mò tại sao nó hoạt động như thế này ...

Cảm ơn,

Paweł

Answer 1

bạn phải sử dụng các currentTarget sự kiện của bạn.

$('.addToFriends a').click(function(event){ 
    event.currentTarget;  
    ... 
}); 

Answer 2

Ok, nhưng nếu tôi bấm vào SPAN và gọi stopPropagation() phương pháp mã của tôi theo hình thức đó sẽ không làm việc:

$('.addToFriends a').click(function(event){ 
    var target = $(event.target); 
    if (target.is('a')) { 
     // do ajax request 
     event.stopPropagation();    
     event.preventDefault(); 
    } 

});

Tuy nhiên, tôi đang thiếu một số điểm quan trọng liên quan đến sự kiện bubbling.

Answer 3

Bạn luôn có thể đọc specification. Một hướng dẫn tốt đẹp cũng có sẵn here.

DừngPropagation chỉ có ý nghĩa nếu bạn đã xác định trình xử lý sự kiện nhấp cho cả phần tử SPAN và A. Gọi stopPropagation trong trình xử lý sự kiện SPAN sẽ ngăn cản trình xử lý A được gọi. Điều này giả định pha bong bóng mặc định.