此功能在 IE、Firefox 和 Chrome 上完美运行，但在 iPhone 上，它仅在单击<img>. 单击页面（除了 img 之外的任何地方）都不会触发该事件。
$(document).ready(function () {
$(document).click(function (e) {
fire(e);
});
});
function fire(e) { alert('hi'); }
HTML 部分非常基础，不应该是一个问题。
有任何想法吗？
$(document).click() 在 iPhone 上无法正常工作。jquery
IT技术
javascript
jquery
iphone
click
onclick
2021-01-28 05:14:52
6个回答
简答：
<style>
.clickable-div
{
cursor: pointer;
}
</style>
更长的答案：
重要的是要意识到，如果您只是使用<a>标签，一切都会按预期工作。您可以错误地单击或拖动<a>iPhone上的常规链接，一切都如用户所愿。
我想您有不可点击的任意 HTML - 例如包含无法用 .html 包装的文本和图像的面板<a>。当我有一个想要完全可点击的面板时，我发现了这个问题。
<div class='clickable-div' data-href="http://www.stackoverflow.com">
... clickable content here (images/text) ...
</div>
为了检测这个 div 中任意位置的点击，我使用 jQuery 和data-href上面显示的html 属性（这个属性是我自己发明的，不是标准的 jQuery 或 HTML 数据属性。）
$(document).on('click', '.clickable-div', function() {
document.location = $(this).data('href');
});
无论您点击多少，这都适用于您的桌面浏览器，但不适用于 iPad。
您可能很想将事件处理程序从 更改click为click touchstart- 这确实会触发事件处理程序。但是，如果用户想要向上拖动页面（滚动），他们也会触发它 - 这是一种糟糕的用户体验。[您可能已经通过偷偷摸摸的横幅广告注意到这种行为]
答案非常简单：只需设置 csscursor: pointer。
<style>
.clickable-div
{
cursor: pointer;
}
</style>
这为桌面用户带来了额外的好处，即可以使用手形图标来指示该区域是可点击的。
改变这个：
$(document).click( function () {
对此
$(document).on('click touchstart', function () {
也许这个解决方案不适合你的工作，就像回复中描述的那样，这不是最好的解决方案。请检查其他用户的其他修复程序。
添加以下代码有效。
问题是 iPhone 不会引发点击事件。它们引发“触摸”事件。非常感谢苹果。为什么他们不能像其他人一样保持标准？无论如何，感谢尼科的小费。
归功于：http : //ross.posterous.com/2008/08/19/iphone-touch-events-in-javascript
$(document).ready(function () {
init();
$(document).click(function (e) {
fire(e);
});
});
function fire(e) { alert('hi'); }
function touchHandler(event)
{
var touches = event.changedTouches,
first = touches[0],
type = "";
switch(event.type)
{
case "touchstart": type = "mousedown"; break;
case "touchmove": type = "mousemove"; break;
case "touchend": type = "mouseup"; break;
default: return;
}
//initMouseEvent(type, canBubble, cancelable, view, clickCount,
// screenX, screenY, clientX, clientY, ctrlKey,
// altKey, shiftKey, metaKey, button, relatedTarget);
var simulatedEvent = document.createEvent("MouseEvent");
simulatedEvent.initMouseEvent(type, true, true, window, 1,
first.screenX, first.screenY,
first.clientX, first.clientY, false,
false, false, false, 0/*left*/, null);
first.target.dispatchEvent(simulatedEvent);
event.preventDefault();
}
function init()
{
document.addEventListener("touchstart", touchHandler, true);
document.addEventListener("touchmove", touchHandler, true);
document.addEventListener("touchend", touchHandler, true);
document.addEventListener("touchcancel", touchHandler, true);
}
试试这个，只适用于 iPhone 和 iPod，这样你就不会在 chrome 或 firefox mobile 上使所有东西都变成蓝色；
/iP/i.test(navigator.userAgent) && $('*').css('cursor', 'pointer');
基本上，在 iOS 上，默认情况下，事物不是“可点击的”——它们是“可触摸的”（pfffff），因此您可以通过给它们一个指针光标来使它们“可点击”。完全有道理，对吧？？
CSSCursor:Pointer;是一个很好的解决方案。FastClick https://github.com/ftlabs/fastclick是另一种解决方案，如果您Cursor:Pointer;出于某种原因不想要某个元素，则不需要您更改 css 。无论如何，我现在都使用 fastclick 来消除 iOS 设备上的 300 毫秒延迟。