jquery - .click 事件未在 iOS 上的 Chrome 中触发

Question

当用户单击移动设备上的菜单栏时，我使用以下代码在我的网站上显示下拉菜单。

$('#mobile-menu').click(function() {
    $('nav').toggleClass('open');
    $('#mobile-menu').toggleClass('open');
});

它在桌面浏览器和 iOS 上的 Safari 中运行良好，但在 iOS 上的 Chrome 中它什么也不做。

奇怪的是，如果我点击 Chrome 中的选项图标并请求桌面版本，那么网站看起来完全一样，但菜单栏现在可以工作了。

任何想法为什么会这样？

score 3 · Accepted Answer

对于遇到此问题的其他任何人 - iOS Chrome 在触发.click事件之前会检查两件事之一。你可以选择其中任何一个，或者如果你是偏执狂，你也可以选择两者。

该元素必须具有 CSS 属性：cursor:pointer;或者，
- 编辑：需要注意的一个有趣的怪癖：如果您的cursors:pointer;规则仅在媒体查询中，iOS Chrome 也不会触发点击事件。在这种情况下，只需确保您有一个包含cursor:pointer;媒体查询之外的元素的 CSS 规则，或者，请查看下面的第二个选项。
元素需要一个onclick=""属性。
- 旁注：该onclick属性可以是空白的（假设您想在自己的.js文件中定位/使用事件），只要它在那里。请参见示例 2。

示例 1 - CSS

这是迄今为止解决问题的最简洁/最好的方法。确保您的 CSS 包含以下内容：

#mobile-menu {
    cursor: pointer;
}

虽然不如 CSS 解决方案好，但我不得不使用它几次都没有失败。

确保您的 HTML 标记包含如下onclick属性：

<div id="mobile-menu" onclick=""> ... </div>

score 0 · Accepted Answer

尝试使用点击事件而不是点击事件。它可能有效

$('#mobile-menu').tap(function() {
    $('nav').toggleClass('open');
    $('#mobile-menu').toggleClass('open');
});