jQuery.sur() et.délégué() ne fonctionne pas sur iPad

Changez le style du curseur du corps sur iOS en "pointeur" et tout fonctionnera parfaitement. Vous n'aurez pas à ajouter onclick="" sur chaque élément que vous souhaitez cliquable...

<script type="text/javascript">
    $(function() {
        // The trick
        if (/ip(hone|od)|ipad/i.test(navigator.userAgent)) {
           $("body").css ("cursor", "pointer");
        }
        // The test
        $("body").on("click", "#click", function() {
            alert("This also works on iOS !");
        });
    });
</script>
<div id="click">Click here</div>

Je sais ce que vous pensez en ce moment: "WTF!".

Je ne sais pas pourquoi cela ne fonctionne pas, c'est probablement un bug, mais il y a une bonne solution de contournement. Il suffit de mettre onclick="" à la div que vous déléguez et cela fonctionnera parfaitement

<div id="click" onclick="">Click here</div>
<script>
$("body").on("click", "#click", function() {
    alert("This works on iPad");
});
</script>

Violon

Sur iOS il n'y a pas d'événement bouillonnant sans un style de curseur.
Donc, dans votre CSS, vous devez ajouter cursor: pointer; à l'élément.

$('body').on('click', '#click', function() {
    alert("This alert won't work on iPad");
});

#click { 
  font-size: 24px; 
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="click">Click here</div>

Je sais qu'il a été demandé il y a longtemps, mais j'ai pensé qu'une solution CSS simple {[6] } pourrait aider.

J'ai trouvé une solution sur http://www.danwellman.co.uk/fixing-jquery-click-events-for-the-ipad/

Faites l'approche suivante:

var isIPad = function() {
    return (/ipad/i).test(navigator.userAgent);
};
var isIPhone = function() {
    return (/iphone/i).test(navigator.userAgent);
};
var isIPod = function() {
    return (/ipod/i).test(navigator.userAgent);
};

Et où vous liez le Click-event-handler, faites-le:

var eventName = (isIPod() || isIPad() || isIPhone()) ? "touchstart" : "click";
// if you are using jquery-mobile
eventName = (isIPod() || isIPad() || isIPhone()) ? "touchstart" : "vclick";

$(".selector").bind(eventName, function(e) {
    //do something here
});
// or
$(document).on(eventName, ".selector", function(e) {
    //do something here
});

C'est ça.

Je faisais face à ce problème sur iPhone 5C et ci-dessous.
Cela a fonctionné pour moi:

body {
  cursor:pointer;
}

J'ai eu un problème avec un message que j'ajoute au corps html. J'ai trouvé ce problème sur l'événement [jQuery 'click' ne fonctionne pas sur iOS Safari?

J'ai utilisé ceci

$('body').on('click touchstart', 'someselect', function(){})

Et cela a fonctionné sur iPhone 4S et iPhone 5S