Tôi giả sử rằng tôi có một <div>
vùng chứa đầu vào với văn bản, thanh trượt và các nút trong đó và muốn hạn chế các thao tác nhấn đúp vô tình trong đó <div>
. Những điều sau đây không ngăn cản việc phóng to vùng đầu vào và nó không liên quan đến việc nhấn đúp và phóng to bên ngoài <div>
vùng của tôi . Có các biến thể tùy thuộc vào ứng dụng trình duyệt.
Tôi vừa thử nó.
(1) Đối với Safari trên iOS và Chrome trên Android và là phương pháp ưu tiên. Hoạt động ngoại trừ ứng dụng Internet trên Samsung, nơi nó vô hiệu hóa tính năng nhấn đúp không phải trên toàn bộ <div>
, nhưng ít nhất là trên các phần tử xử lý các lần nhấn. Nó trả về return false
, với ngoại lệ trên text
và range
đầu vào.
$('selector of <div> input area').on('touchend',disabledoubletap);
function disabledoubletap(ev) {
var preventok=$(ev.target).is('input[type=text],input[type=range]');
if(preventok==false) return false;
}
(2) Tùy chọn đối với ứng dụng Internet tích hợp sẵn trên Android (5.1, Samsung), hạn chế nhấn đúp trên <div>
, nhưng ngăn phóng to trên <div>
:
$('selector of <div> input area').on('touchstart touchend',disabledoubletap);
(3) Đối với Chrome trên Android 5.1, vô hiệu hóa tính năng nhấn đúp, không ngăn cản việc phóng to và không thực hiện gì với việc nhấn đúp trong các trình duyệt khác. Nhấn đúp để ức chế <meta name="viewport" ...>
là khó chịu, bởi vì <meta name="viewport" ...>
có vẻ như thực hành tốt.
<meta name="viewport" content="width=device-width, initial-scale=1,
maximum-scale=5, user-scalable=yes">