У меня есть два обработчика событий, привязанных к тегу привязки: один для фокуса и размытия.
Обработчики запускаются на рабочем столе, но в iphone и ipad только фокус запускается правильно. Blur не запускается, если я нахожусь за пределами привязанного тега (размытие срабатывает только при нажатии некоторых других элементов формы на странице):
$("a").focus(function(){
console.log("focus fired");
});
$("a").blur(function(){
console.log("blur fired");
});
HTML:
<html>
<form>
<a href="#">test link</a>
<div>
<input type="text" title="" size="38" value="" id="lname1" name="" class="text">
</div>
<div style="padding:100px">
<p>test content</p>
</div>
</form>
</html>
Если привязка привязана к каким-либо событиям, первое нажатие на нее в iOS заставляет якорь помещаться в состояние зависания и сфокусироваться. Отключить удаляет состояние зависания, но ссылка остается сфокусированной. Это по дизайну. Чтобы правильно управлять приложением на iOS, вам необходимо реализовать сенсорные события и реагировать на них вместо настольных.
Существует полное руководство по использованию событий Javascript в WebKit в iOS.
Это взломать, но вы можете получить .blur для запуска, зарегистрировав обработчик кликов на каждом элементе DOM. Это удаляет фокус с ранее сфокусированного элемента.
$( '*' ).click( function ( ) { } );
$( 'html' ).css( "-webkit-tap-highlight-color", "rgba(0, 0, 0, 0)" );
Вторая строка удаляет выделение при нажатии элементов.
Я знаю, что это неоптимально, но это может заставить вас пойти.
Если вы работаете с сенсорными устройствами, вы можете использовать событие touchleave или touchhend для обработки, когда пользователь щелкает за пределами области.
$("a").on('touchleave touchcancel', function () {
// do something
});
Для этого вам необходимо обновить функцию фокуса, чтобы прослушать событие click, как показано ниже.
$("a").on("click", function (e) {
if(e.handled !== true) {
e.handled = true
} else {
return false
}
// do something
})
в самом удаленном div
<div onclick='click()'>
затем в javascript
function click(){}