Thuộc tính TouchEvent của HTML DOM trả về đối tượng TouchList tương ứng với danh sách tất cả các điểm tiếp xúc được kích hoạt trên bề mặt cảm ứng.
LƯU Ý:Nếu một lần chạm được kích hoạt trên nút được chỉ định hoặc bất kỳ nút con nào của nó thì các lần chạm sau sẽ được tính ngay cả khi chúng không được kích hoạt trên cùng một nút.
Sau đây là cú pháp -
Trả lại đối tượng TouchList
event.touches
Lưu ý:Chúng tôi đã chạy các ví dụ về sự kiện Touch trên Trình chỉnh sửa HTML Trực tuyến được truy cập trên Điện thoại di động hoặc các hệ thống có quyền truy cập cảm ứng. Thao tác này được thực hiện để chúng ta có thể thực hiện các thao tác chạm như chạm vào màn hình trong 2 giây.
Hãy để chúng tôi xem ví dụ về lần chạm TouchEvent tài sản -
Ví dụ
<!DOCTYPE html>
<html>
<head>
<title>TouchEvent touches</title>
<style>
form {
width:70%;
margin: 0 auto;
text-align: center;
}
* {
padding: 2px;
margin:5px;
}
input[type="button"] {
border-radius: 10px;
}
</style>
</head>
<body>
<form id="formSelect" ontouchstart="startEventAction(event)" ontouchend="endEventAction(event)">
<fieldset>
<legend>TouchEvent-touches</legend>
<label for="textSelect">Game Players Selector</label>
<div id="divDisplay">All Players Place a Finger on Screen<br>Game Starting in 2 sec</div>
</fieldset>
</form>
<script>
var divDisplay = document.getElementById("divDisplay");
var gameSelect = document.getElementById("formSelect");
var duration = 2000;
var timer;
gameSelect.ontouchstart = startEventAction;
function startEventAction(event) {
timer = setTimeout(function(){
eventAction(event)
}, duration);
}
function endEventAction(event){
if(timer)
clearTimeout(timer);
eventAction(event);
}
function eventAction(event) {
var players = event.touches.length;
divDisplay.textContent = 'Total Players: '+players;
gameSelect.removeAttribute('ontouchstart');
gameSelect.removeAttribute('ontouchend');
}
</script>
</body>
</html> Đầu ra
Trước khi chạm vào phần tử biểu mẫu -
Sau khi chạm vào phần tử biểu mẫu trong 2 giây -
