19

我有一组用作按钮的 Div。这些按钮有一个简单的 jquery click() 函数，适用于除 iOS 之外的所有浏览器。

例如：

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

和

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

   alert('hi');

});

我不确定为什么这在 iOS 上不起作用 - 显然 iOS 中没有“点击”。

不幸的是，我自己没有 iphone 设备来测试这个，但是我收到了很多来自我的客户的抱怨，他们想点击一些东西，但什么也没发生。

让它发挥作用的关键是什么？

4

5 回答 5

37

单击“：表示当同一元素上发生 mousedown 和 mouseup 事件或通过键盘激活元素时。

来自Jquery Bug，有解决方法，只需添加"cursor: pointer"到元素的 CSS，click 事件就会按预期工作。你甚至可以看到这个Jquery 点击 Ios寻求帮助

于 2012-05-14T05:42:33.367 回答
6

实际上，接受的答案对我不起作用。我尝试使用“cursor:pointer”、onclick=""，甚至将元素转换为锚标记。

我所做的就是绑定点击事件的 touchstart 事件。为了让它在所有平台上都能正常工作，我不得不像这样进行丑陋的 ua 欺骗：

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
});
于 2015-12-28T11:53:58.283 回答
2

根据Marek 的回答，这是我的看法（稍微整理了一下）：

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

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

在标准方面，该行业还有很多工作要做……</p>

编辑：

在安卓手机上没用。采取了更严格的方法：

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

$('.clickable_element').on(pickclick, function(e) {
     // do something here
});
于 2016-04-23T20:56:24.523 回答
2

同样基于Marek 的回答，它使事件适应设备以触发功能，这是一个强制触发 iOS 设备点击的代码，其中首先有一个 touchstart 事件：

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

if (iOS) {
   $(document).on('touchstart', function (e) {
       e.target.click();
   });
}
于 2017-02-01T16:28:33.333 回答
0

你可以使用这个：

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

另一种解决方案是将元素的光标设置为指针，并与 jQuery live 和 click 事件一起使用。在 CSS 中设置它。

于 2012-05-14T05:51:28.247 回答