Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> JavaScript

Cách tốt nhất để phát hiện thiết bị màn hình cảm ứng (touch screen) bằng JavaScript

Cách tin cậy nhất là kiểm tra sự tồn tại của sự kiện ontouchstart trên document.documentElement. Điều này hoạt động trên hầu hết trình duyệt hiện đại.

Hàm kiểm tra

function checkTouchDevice() {
  return 'ontouchstart' in document.documentElement;
}

Sử dụng để phân nhánh Mobile/Desktop

if (checkTouchDevice()) {
  // Thiết bị cảm ứng (Mobile, Tablet, Touch laptop)
} else {
  // Desktop không cảm ứng
}

Lưu ý và cải tiến

  • Laptop màn hình cảm ứng (hybrid) sẽ trả về true.
  • Để phân biệt chính xác hơn, kết hợp với navigator.maxTouchPoints > 0.
  • Tránh userAgent sniffing – không tin cậy.
  • CSS Media Query (pointer: coarse) cũng hữu ích cho styling.