Lực tập trung vào một yếu tố có ngoại lệ. (jQuery)

Question

Tôi có hai trường nhập. Tôi muốn tập trung vào #area cho dù người dùng nhấp vào số trừ khi nó nằm trên #input. Tôi đã thử một cái gì đó như thế này, nhưng kể từ khi đầu vào là một phần của tài liệu, nó không hoạt động.

$("#area").focus(); 
$(document).click(function() { $("#area").focus() }; 
$("#input").click(function() { $("#input").focus() }; 

Suy nghĩ?

Answer 1

thay đổi nó để

$("#area").focus(); 
$(document).click(function() { $("#area").focus() }); 
$("#input").click(function(e) { e.stopPropagation(); $("#input").focus() }); 

này sẽ dừng sự kiện từ bọt lên đến tài liệu này, và sẽ chỉ được đánh bắt bởi các #input

Answer 2

Bạn cần phải hủy bỏ sự kiện bọt khi nhấp vào bình thường đầu vào, hoặc bằng cách trả về false trong trình xử lý sự kiện của bạn hoặc bằng cách gọi e.stopPropagation().

Tôi không chắc liệu thứ tự mà bạn gán trình xử lý sự kiện có quan trọng không, nhưng bạn có thể thử đặt sự kiện #input trước tiên.

Answer 3

Giải pháp stopPropogation đơn giản hơn những gì tôi sắp đề xuất, nhưng có lẽ đáng để thảo luận về tùy chọn khác này. Trong đó chức năng đầu tiên bạn đã có, bạn có thể thử dùng các đối số đầu tiên với chức năng, mà là một jQuery bình thường đối tượng sự kiện:

$(document).click(function(event) { ... 

và thử nghiệm nó để xem nếu target tài sản của sự kiện này là đầu vào của bạn :

$(document).click(function(event) { 
    if(! (event.target == $("#input").get(0))) 
     $("#area").focus(); 
}