Trình duyệt trên máy tính có hỗ trợ các sự kiện chạm không?

Question

Tôi đang cố gắng bắt kịp tốc độ trên HTML5 bằng cách tạo mẫu ứng dụng vẽ cực kỳ đơn giản bằng cách sử dụng <canvas> và các sự kiện chạm như ontouchstart và ontouchmove.

Điều này hiển thị và hoạt động tốt trong trình giả lập Android, nơi tôi sử dụng các nhấp chuột để mô phỏng sự kiện chạm. Tuy nhiên, nó không hoạt động chút nào khi chạy trong trình duyệt máy tính để bàn của tôi (Safari 5.1.1, Firefox 7 trên Windows).

Tôi nghĩ rằng các sự kiện nhấp chuột sẽ được hiểu là sự kiện chạm như chúng đang chạy trong trình mô phỏng.

Tôi tự hỏi bây giờ nếu có lẽ trình duyệt trên máy tính để bàn chỉ đơn giản là không hỗ trợ các sự kiện chạm.

Answer 1

Firefox 6 trở lên hỗ trợ các sự kiện chạm. Xem bảng tương thích here.

MDN article on Touch Events

EDIT: Bạn có đang thử nghiệm bằng màn hình cảm ứng hoặc chuột không? Các sự kiện chuột không tự động dịch để chạm vào các sự kiện. Xem this post để biết cách mô phỏng sự kiện chạm bằng chuột.

Answer 2

ontouchstart sẽ là phần bổ sung vào phiên bản webkit của web dành cho javascript. bạn có thể kiểm tra nó nhưng chỉ trên một trình giả lập.

Answer 3

Nó thực sự là một cách khác. Trình duyệt trên thiết bị di động dịch các sự kiện chạm vào chuột để hỗ trợ kế thừa. Nếu nó cần phải hoạt động trên cả thiết bị di động và máy tính để bàn và bạn không thực sự cần sự kiện chạm, bạn chỉ có thể sử dụng các sự kiện chuột để thay thế. Nếu không, hãy liên kết cả sự kiện chạm và chuột và có sự kiện chạm hủy sự kiện chuột. Bằng cách này trên các thiết bị di động, cảm ứng cháy và chuột thì không. Trên máy tính để bàn, chạm không cháy và chuột sẽ.

Đối với pilau, đây là một ví dụ đơn giản về việc hủy sự kiện nhấp trên thiết bị di động. Xin lưu ý câu hỏi là nhiều hơn về bản vẽ sẽ liên quan đến việc kéo nhấp chuột, sẽ yêu cầu mã nhiều hơn một chút để phát hiện, nhưng ý tưởng cơ bản là giống nhau, ràng buộc các sự kiện bạn cần xử lý. Sau đó, e.preventdefault() sẽ ngừng các trình duyệt trên thiết bị di động mô phỏng các sự kiện loại nhấp chuột.

$('#element').on('touchend click', function(e){ 

    // Do your onclick action now 

    // cancel the onclick firing 
    e.preventDefault(); 
});