JS властивість Event.touchcancel
Загальний опис
Подія touchcancel виникає, коли поточний сеанс торкання екрана переривається через непередбачені обставини, такі як системні переривання або зміна контексту. Зазвичай це відбувається, коли пристрій вирішує завершити взаємодію торкання, наприклад, коли відбувається зміна фокусу або з'являється системне сповіщення.
Для роботи з подією touchcancel, програмісти використовують метод addEventListener, щоб додати обробник події до елементів, які реагують на торкання. В обробнику ви можете отримати доступ до об'єкта події, який містить інформацію про сеанс торкання, що було скасоване, через властивості touches, targetTouches та changedTouches.
Типовий сценарій для обробки події touchcancel включає очищення або скасування дій, що були активовані іншими подіями торкання (наприклад, touchstart або touchmove). Наприклад, якщо користувач почав жест, але система скасувала його, ви можете використовувати цю подію для скидання будь-яких проміжних станів у додатку.
element.addEventListener('touchcancel', function(event) {
console.log('Торкання було скасоване');
// Очищення інтерфейсу або скидання дій
});
Коли подія touchcancel спрацьовує, вона часто містить обмежену кількість інформації порівняно з іншими подіями торкання, такими як touchmove. Тому важливо грамотно обробляти її, особливо у випадках, коли ви вже почали обробляти інші події торкання.
При обробці події слід пам'ятати, що вона не завжди гарантує наявність конкретної причини для скасування, тому її потрібно використовувати для загальної обробки випадкових скасувань.
| Порада: | Якщо подію |
| Порада: | Для кросбраузерної сумісності переконайтеся, що перевіряєте підтримку події |
| Порада: | Щоб уникнути проблем із продуктивністю, подію |
Синтаксис
element.addEventListener('touchcancel', function(event) {
// Обробка події
});Значення
Return
Переглядачі
| Переглядач | |||||
|---|---|---|---|---|---|
66 |
57 |
11.1 |
53 |
16 |
| Переглядач | ||||
|---|---|---|---|---|
66 |
66 |
57 |
11.3 |
| Переглядач | ||
|---|---|---|
15.0.0 |
1.0 |
Приклади
У цьому прикладі показано, як зупинити анімацію за допомогою cancelAnimationFrame після спрацювання події touchcancel. Це корисно для скасування дій, які залежать від тривалого процесу.
element.addEventListener('touchcancel', function(event) {
// Скасування анімації
cancelAnimationFrame(animationId);
console.log('Анімація була зупинена через скасування торкання');
});Цей приклад демонструє, як скинути стан жесту "перетягування" у разі, якщо торкання було перервано. Це допоможе уникнути збоїв, якщо жест був частково завершений
element.addEventListener('touchcancel', function(event) {
// Відміна жесту "перетягування"
resetDragState();
console.log('Жест перетягування було скасовано');
});