Làm thế nào để ngăn chặn sự kiện tuyên truyền khi sử dụng đại biểu?

Question

Khi tôi sử dụng. Liên kết để ràng buộc sự kiện trên con và cha mẹ, sự kiện con có thể ngăn chặn sự kiện propogation với trả về false; Nhưng khi tôi sử dụng đại biểu, trả về false; không dừng tuyên truyền sự kiện.

http://jsfiddle.net/J3EAQ/

html:

<div class="parent"> 
    <div class="child"></div> 
    <div class="child"></div> 
</div> 

js:

$('.parent').delegate('.child','click',function(e){ 
    alert('child click'); 
    return false; 
}); 
$('.parent').bind('click',function(e){ 
    alert('parent click'); 
}); 

Answer 1

e.stopPropagation() sẽ không hoạt động trong trường hợp này. Sử dụng e.stopImmediatePropagation() để thay thế. Đây là một số fiddle

Answer 2

Bạn nên sử dụng e.stopPropagation() để ngăn chặn sự lan truyền, không phải bằng cách trả lại sai.

return false về mặt kỹ thuật là hai điều; 1) ngăn chặn các hành động mặc định, và 2) dừng tuyên truyền. Thử chuyển sang lời gọi phương thức trên e và xem điều đó có khắc phục được sự cố của bạn hay không.

Answer 3

Tại sao hai bộ xử lý nhấp chuột khi bạn có thể có một:

$('.parent').click(function (e) { 
    if ($(e.target).is('.child')) { 
     alert('child click'); 
    } else { 
     alert('parent click'); 
    }  
}); 

Live Demo:http://jsfiddle.net/J3EAQ/2/

---

Một tổng quát của mô hình này:

$(element).click(function (e) { 
    if (e.target === this) { 
     // this element was clicked directly 
    } else { 
     // this element was NOT clicked directly 
     // a descendant of this element was clicked 
    }  
}); 

---

Trình xử lý riêng biệt?

$('.parent').click(function (e) { 
    if (this ==== e.target) { 
     parentClicked.call(e.target, e); 
    } else { 
     childClicked.call(e.target, e); 
    }  
}); 

function childClicked(e) { 
    // child click handler 
} 

function parentClicked(e) { 
    // parent click handler 
} 

Answer 4

Bạn luôn có thể sử dụng e.stopPropagation()

Answer 5

sự kiện của bạn không được phổ biến. bạn đang ràng buộc trình xử lý nhấp chuột vào .parent và bạn đang nhấp vào .parent

Answer 6

Điều gì làm việc cho tôi là kiểm tra tên lớp của mục tiêu nhấp chuột trong trình xử lý nhấp chuột mà bạn không muốn bị kích hoạt bởi sự kiện nhấp chuột khác. Một cái gì đó như thế này.

if(e.target.className.toString().indexOf("product-row") > -1){ 
     // Only do stuff if the correct element was clicked 
    }