JQuery on click does not work on iPhone (touch devices)

Can someone explain to me why this works in a browser, but not on mobile devices such as the Apple iPhone. On iPhone, I never get hello from an alert. Why?

 <div class="close"> Click here </div> 

JS:

 $(document).on('click', '.close', function() { alert('hello'); }); 

Example here: https://jsfiddle.net/27ezjrqr/5/

+9
source share
4 answers

By default, divs are not clickable elements. But adding cursor: pointer; makes iOS treat it as clickable.

So all you have to do is add

 .close { cursor: pointer; } 

into your CSS and then it will work.

Proof here: https://jsfiddle.net/27ezjrqr/6/

 $(document).on('click', '.close', function() { alert('hello'); }); 
 .close { cursor: pointer; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="close"> Click here </div> 
+35
source

I used the touchstart event with a click, it did the job for me

  $(document).on("click touchstart tap", "#button_X", function (){ //your code here }); 
+1
source

Javascript alert() and more bugs fixed with iOS 7.0.3.

0
source

Click events do not work as expected in iOS. Instead, you can use something like touchstart or use the strange iOS quirk: in your CSS set .close{cursor:pointer} .

0
source

Source: https://habr.com/ru/post/1244902/


All Articles