Sự kiện nhấp chuột jQuery - Làm cách nào để biết liệu con chuột đã được nhấp hay đã nhập phím đã được nhấn chưa?

Question

Tôi có một mối quan tâm về khả năng sử dụng trên trang web của tôi. Tôi có một tập hợp các tab, mỗi tab chứa một biểu mẫu. Khi bạn nhấp vào liên kết tab, nó sẽ tập trung vào hộp văn bản đầu tiên trong nội dung tab. Những người định hướng chuột yêu thích "tính năng" này. Vấn đề là khi người dùng định hướng bàn phím sử dụng phím TAB trên bàn phím của họ để xem qua các tab. Họ nhấn enter trên tab mà họ muốn xem, sự kiện nhấp sẽ kích hoạt và tab hiển thị, nhưng tiêu điểm được đưa vào hộp văn bản, điều chỉnh thứ tự tab của chúng hoàn toàn. Vì vậy, khi họ nhấn tab lần nữa, họ muốn chuyển đến tab tiếp theo trên màn hình, nhưng vì tiêu điểm được di chuyển bên trong biểu mẫu nên họ không thể dễ dàng truy cập tab tiếp theo bằng bàn phím.

Vì vậy, trong sự kiện nhấp chuột tôi cần xác định xem họ có thực sự nhấp vào sự kiện đó bằng nút chuột hay không. Điều này có thể không? Nỗ lực đầu tiên của tôi là thế này:

$("#tabs li a").click(function(e) { 
    var tab = $(this.href); 
    if(e.keyCode != 13) 
    $("input:first", tab).focus(); 
}); 

Nhưng keyCode luôn là 0. Thuộc tính which cũng phải lúc nào cũng 0. Xin giúp!

Answer 1

Đây là giải pháp mà tôi đã đưa ra, thật đáng ngạc nhiên. Tôi bị mắc kẹt KeyDown vào các liên kết tab, và gây ra sự kiện click khi keyCode là 13. May mắn thay, các trigger chức năng cho phép chúng ta vượt qua các thông số bổ sung cho các xử lý sự kiện ...

$("#tabs li a").keydown(function(e) { 
    if(e.keyCode == 13) { 
    $(this).trigger("click", true); 
    e.preventDefault(); 
    } 
}); 

Vì vậy, tôi chỉ phải thay đổi của tôi xử lý nhấp chuột để nhận thông số mới và sử dụng thông số này ...

$("#tabs li a").click(function(e, enterKeyPressed) { 
    if(enterKeyPressed) 
    alert("Enter key"); 
    else 
    alert("Clicked"); 
}); 

Tôi cũng đặt một số demo on jsFiddle. Cảm ơn tất cả những ai đã đọc câu hỏi.

Answer 2

Biến toàn cầu "tập trung" có tác dụng vô hiệu hóa tập trung vào cài đặt chuột sau khi sử dụng tab trên tab nhất định cho đến khi chuột được di chuyển đến khối mới.

Đây không phải là tính năng bạn yêu cầu, nhưng tôi tin rằng nó có thể cung cấp cho bạn những gì bạn đang tìm kiếm.

ví dụ: chuột hoovers tùy chọn 5, bạn nhấn tab, bây giờ bạn lưu trữ 5 trong biến, không tập trung vào 5 cho đến khi cái gì khác được tập trung vào, nhưng ngay sau cái gì khác là tập trung, toàn cầu được quay trở lại -1.

Cách giải quyết không sạch sẽ nhất tôi thừa nhận điều đó một cách tự do.