Comment faire fonctionner ma fonction 'clic' avec iOS

J'ai un ensemble de Div qui agissent comme des boutons. Ces boutons ont un jquery simple click() fonction qui fonctionne dans tous les navigateurs, sauf iOS.

Par exemple:

<div class="button">click me</div>

et

$('.button').click(function(){

   alert('hi');

});

Je ne sais pas pourquoi cela ne fonctionne pas sur iOS, clairement il n'y a pas de "cliquer" dans iOS.

Malheureusement je n'ai pas d'iphone de périphérique à tester moi-même, mais j'ai beaucoup de plaintes de la part de mes clients qui veulent cliquez sur les choses et rien ne se passe.

Ce qui est la clé pour obtenir ce travail?

source d'informationauteur willdanceforfun | 2012-05-14

  1. 31

    Cliquez sur ": Quand un mousedown et mouseup événement de se produire sur le même élément OU un élément est activé par le clavier.

    de Jquery Bug, il y a des travaux partout , il suffit d'ajouter "cursor: pointer" à celle de l'élément CSS et l'événement click fonctionne comme prévu. et vous pouvez même voir ce Jquery cliquez sur Ios pour aider

  2. 4

    En fait, l'on a accepté la réponse n'a pas de travail pour moi.
    J'ai essayé d'utiliser "cursor:pointer", onclick="", et même de convertir l'élément à une balise d'ancrage.

    Ce que j'ai fait pour le faire fonctionner est de lier les évènements touchstart événement place de l'événement click. Pour le faire fonctionner sur toutes les plates-formes, j'ai dû à une vilaine ua usurpation comme ceci:

    var ua = navigator.userAgent,
event = (ua.match(/iPad/i) || ua.match(/iPhone/)) ? "touchstart" : "click";

jQuery("body").on(event, '.clickable_element', function(e) {
    //do something here
});
  3. 2

    Basé sur Marek répondre c'est mon prendre sur elle (c'est un peu nettoyé):

    var ua = navigator.userAgent, 
pickclick = (ua.match(/iPad/i) || ua.match(/iPhone/)) ? "touchstart" : "click";

$('.clickable_element').on(pickclick, function(e) {
     //do something here
});

    Il y a encore beaucoup de travail à venir pour l'industrie quand il s'agit de normes...

    EDIT:

    Ne fonctionne pas sur les téléphones Android. A pris une plus approche rigide:

    if (document.documentElement.clientWidth > 1025) { pickclick = 'click' }
if (document.documentElement.clientWidth < 1025) { pickclick = 'touchstart' }

$('.clickable_element').on(pickclick, function(e) {
     //do something here
});
  4. 1

    Vous pouvez utiliser ceci:

    $('button').bind( "touchstart", function(){
    alert('hi');
});

    Une autre Solution est de mettre de l'élément curseur sur le pointeur et il travailler avec jQuery live et cliquez sur l'événement. Mettre dans le CSS.

  5. 1

    Également basé sur Marek répondrequi s'adapte à l'événement de l'appareil pour déclencher une fonction, voici un code qui force pour tirer un clic sur les appareils iOS, où il est tout d'abord évènements touchstart événement :

    var UA = navigator.userAgent,
iOS = !!(UA.match(/iPad|iPhone/i));

if (iOS) {
   $(document).on('touchstart', function (e) {
       e.target.click();
   });
}