javascript - navegador - ¿Por qué no se dispara el evento de desenfoque en iOS Safari Mobile(iPhone/iPad)?
safari windows 10 (4)
Tengo dos controladores de eventos vinculados a una etiqueta de anclaje: uno para enfocar y desenfocar.
Los controladores se activan en el escritorio, pero el enfoque de solo iPhone e iPad se activa correctamente. El desenfoque no se activa si hago clic fuera de la etiqueta de anclaje (el desenfoque se activa solo cuando hago clic en otros elementos de formulario en la página):
$("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>
Es un truco, pero puede hacer que se ejecute .blur registrando un controlador de clic en cada elemento DOM. Esto elimina el foco del elemento enfocado previamente.
$( ''*'' ).click( function ( ) { } );
$( ''html'' ).css( "-webkit-tap-highlight-color", "rgba(0, 0, 0, 0)" );
La segunda línea elimina el resaltado cuando se hace clic en los elementos.
Sé que esto es subóptimo, pero puede que te pongas en marcha.
Si está trabajando con dispositivos táctiles, puede usar el evento Touchleave o Touchend para controlar cuándo el usuario hace clic fuera del área.
$("a").on(''touchleave touchcancel'', function () {
// do something
});
Para que esto funcione, necesita actualizar su función de enfoque para escuchar un evento de clic de la siguiente manera
$("a").on("click", function (e) {
if(e.handled !== true) {
e.handled = true
} else {
return false
}
// do something
})
Si un ancla tiene algún evento adjunto, la primera pulsación en iOS hace que el ancla se coloque en el estado de desplazamiento y se enfoque. Un toque de distancia elimina el estado de desplazamiento, pero el enlace permanece enfocado. Esto es por diseño. Para controlar adecuadamente una aplicación en iOS, necesita implementar eventos táctiles y reaccionar ante aquellos en lugar de los de escritorio.
Hay una guía completa para usar eventos de Javascript en WebKit en iOS .
en la divin superior
<div onclick=''click()''>
entonces en javascript
function click(){}