Làm cách nào để sử dụng jQuery cho sự kiện nhấp trong ứng dụng web iPhone

Question

Khi tôi sử dụng jQuery cho một sự kiện nhấp chuột đơn giản, nó chỉ hoạt động đối với các liên kết. Có cách nào để làm cho nó hoạt động cho các khoảng thời gian vv:

$("span.clicked").live("click", function(e){alert("span clicked!")}); 

$("a.clicked").live("click", function(e){alert("link clicked!")}); 

SPAN hoạt động trong Safari chứ không phải Mobile Safari (trên iPhone hoặc iPad) trong khi thẻ A hoạt động trong cả hai.

Answer 1

Bạn cần nghe các sự kiện "chạm" và "chạm". Thêm người nghe với jQuery ...

$('span').bind("touchstart", function(e){alert('Span Clicked!')}); 

Bạn có thể muốn nghe một touchstart và touchend để bạn có thể xác minh rằng phần tử mục tiêu khi ngón tay chạm vào cũng giống như các yếu tố nhắm mục tiêu khi các ngón tay đã được gỡ bỏ .

Tôi chắc rằng có lẽ là một cách tốt hơn để làm điều đó nhưng đó nên việc :)

Edit: Có một cách tốt hơn! Xem https://stackoverflow.com/a/4910962/16940

Answer 2

Tôi cũng phải vật lộn với điều này. Sau rất nhiều đồ chơi xung quanh và cố gắng tìm ra vấn đề, tôi bắt gặp một giải pháp đơn giản.

Nếu bạn đặt phần tử cursor thành pointer của phần tử, nó sẽ hoạt động lại một cách kỳ diệu với sự kiện trực tiếp và sự kiện nhấp của Jquery. Điều này chỉ có thể được đặt trên toàn cầu trong CSS.

Answer 3

Bạn thực sự không cần phải sử dụng touchstart hoặc sự kiện touchend, miễn là thẻ 'tuổi' (hoặc bất cứ điều gì khác hơn là một 'a' tag) có một tài sản css của:

cursor:pointer 

nhấp chuột sẽ đăng ký

Answer 4

Tôi đã thử mọi thứ và không có thủ thuật nào hoạt động. Hóa ra tôi không thể nhận được các sự kiện bấm vì tôi có một phần tử video dưới img của tôi. các yếu tố video dường như ăn các sự kiện nhấp chuột.

Answer 5

Bạn cũng có thể coax trình duyệt để tạo các sự kiện nhấp bằng cách thêm thuộc tính onclick trống. Đối với một cách tiếp cận đai-and-niềng răng trong trường hợp một trong hai cách tiếp cận ngừng hoạt động trong bất kỳ bản cập nhật iOS nhất định, bạn có thể sử dụng một cái gì đó như thế này:

$("span.clicked").live("click", function(e){alert("span clicked!")}) 
       .attr('onclick','') 
       .css('cursor','pointer'); 

(giả sử bạn không có bất kỳ onclick thực tế các thuộc tính bạn không nhớ phá hủy)

Answer 6

Bạn có thể thêm một sản phẩm nào onclick thuộc tính, như vậy:

<span onclick=''>Touch or Click Me</span> 
jQuery('span').live('click', function() { alert('foo'); });