Toggling La fonction jQuery ne fonctionne pas sur Safari Mobile

J'essaie de faire fonctionner une fonctionnalité qui existe sur mon site mais qui fonctionne mal sur Safari pour iPhone.Toggling La fonction jQuery ne fonctionne pas sur Safari Mobile

Eh bien, j'ai un élément « li »:

.. 
    <li><input id='showOrHide' type='button' value='show or hide'/></li> 
    <li><input type='text' value='ok'/></li> 
..

Lorsque je clique sur le bouton « afficher ou cacher », l'entrée de texte doit apparaître ou disparaître.

Ensuite, j'ai une fonction jQuery qui lie le clic:

$("#showOrHide").click(function(){ 
    if($(this).parent().next().is(':visible')) 
    $(this).parent().next().hide('slow'); 
else 
    $(this).parent().next().show('slow'); 
});

Le problème est que, si l'élément apparaît, Safari cache montre ensuite.

Je pense donc que Safari vérifie si l'élément est visible ou non. S'il est visible, il le cache, puis va dans la sélection "else". Là, il vérifie si l'élément est visible ou non. Il trouvera le non visible, puis le fera apparaître.

Alors quelqu'un stackoverflow me adivises d'utiliser la fonction de bascule et qui est ce que je faisais:

$("#showOrHide").click(function(){ 
    $(this).parent().next().toggle('slow'); 
});

J'ai essayé votre fonction: Il fonctionne parfaitement sur les navigateurs de bureau (chrome, safari) mais sur Safari pour iPhone il a fait ce que j'ai décrit: montre et cache l'élément caché instantanément.

Existe-t-il une solution pour cela sans utiliser un framework javascript extrernal (mais jQuery)?

Merci, Cordialement

Source

2010-10-08 Zakaria

Je viens d'écrire un programme de démonstration (voir ci-dessous) et il a fonctionné très bien sur Firefox de bureau, Safari dans l'iPhone Simulator et iPad Safari. Vous voulez peut-être vous assurer que l'événement click n'est pas capturé par plusieurs écouteurs d'événement.

<html> 
<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script> 
$(document).ready(function() { 
    $('#showHide').click(function(e) { 
     $(this).parent().next().toggle('slow'); 
    }); 
}); 
</script> 
</head> 

<body> 
<ul> 
    <li><input type="button" value="show hide" id="showHide" /></li> 
    <li><input type="text" value="ok" /></li> 
</ul> 
</body> 
</html>

Source

2010-10-18 04:58:09

Toggling La fonction jQuery ne fonctionne pas sur Safari Mobile

Répondre

Questions connexes