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

Sử dụng FastClick với jQuery Mobile đúng cách

Không cần FastClick khi dùng jQuery Mobile (jQM).

Tại sao?

  • jQuery Mobile đã xử lý độ trễ 300ms (click delay) trên mobile bằng sự kiện vclick (virtual click).
  • vclick kích hoạt ngay trên touchend (hoặc click trên desktop), không chờ 300ms.
  • jQM hoạt động tốt trên cả mobile và desktop.

Cách dùng đúng

$(document).on('vclick', '#impButton', function() {
  // Xử lý click ngay lập tức, không delay 300ms
  console.log('Button clicked!');
});

Lưu ý

  • jQuery Mobile **đã ngừng phát triển** (jQM 1.4.5 - 2014). Không khuyên dùng cho project mới.
  • Project mới: Dùng framework hiện đại (React, Vue, Svelte) + CSS touch-action: manipulation hoặc native click (trình duyệt hiện đại đã loại bỏ 300ms delay nếu viewport meta đúng).
  • Nếu phải dùng jQM cũ: Đừng thêm FastClick (gây conflict, double-click, ghost click).

Giải pháp hiện đại cho 300ms delay (vanilla)

<meta name="viewport" content="width=device-width, initial-scale=1">
/* CSS */
button, a, [role="button"] {
  touch-action: manipulation; /* loại bỏ delay, disable double-tap zoom */
}

Trình duyệt hiện đại (Chrome 32+, Firefox 18+, Safari 9.1+, Edge) tự động loại bỏ 300ms delay khi có viewport meta đúng.