javascript - jquery mouseenter 在 ios Safari 和其他触摸设备上触发。如何阻止它？

Question

我的网站上有以下代码:

    /* Show arrows when card is hovered */
    $('BODY').on('mouseenter', '.card', function (event) {
        $(this).addClass('is-hovered');
    });

    $('BODY').on('mouseleave', '.card', function (event) {
        $(this).removeClass('is-hovered');
    });

这个想法是在带有鼠标的设备上，当鼠标悬停在每张卡片上时，每张卡片都会显示小箭头。在触摸设备上，这些箭头不应出现，因为可以刷卡。

问题是当您按下卡片时，iOS Safari 上会触发 jQuery mouseenter 事件。并非总是如此，但尤其是在按卡内的图像时。不过，它在本质上似乎相当随机。我可以完全禁止 Safari 注册悬停吗？

Answer 1

使用检测触摸设备的库，例如 modernizr 将类 no-touch 添加到 html 标签或通过 modernizr js 使用

if (Modernizr.touch) {
//是触摸
}别的{
//是屏幕
}

关于 js 部分请参见此处 http://www.hongkiat.com/blog/detect-touch-device-modernizr/