单击事件在 Apple 设备上不起作用

Question

So I have a web page that whenever you click into an image it show up in a bigger form.

The code is simple (obviating the rest of the code)

 open_image.addEventListener("click", () => open_image());

 <div id="click-me"> <img src="img_test.jpg"> </div> <div id="bigger-img" style="display: none"> <img src="img_test.jpg"> </div>

What open_image() function does is simply setting display block to the hidden image

This works without problems in PC and android devices, but for apple mobiles devices such as iPad or iPhone the click event seems not to be listened or is like its ignoring it.

I've searched for solutions and seems like in CSS the property cursor: pointer should work, but not for me, after setting this property to the body keeps ignoring the click event.

Any ideas for these apple devices?

Answer 1

use "touchend" in addition to the click event https://developer.mozilla.org/en-US/docs/Web/API/Element/touchend_event