Question

HTML：

<div id="wrapper">
    <div id="a"></div>
</div>

CSS：

#a {
    width: 30px;
    height: 30px;
    background-color: red;
}

JavaScript的：

$('#wrapper').on('mouseup', function() {
    $('#a').css('background-color', 'yellow');
});

只要有鼠标按下事件，红色框就会变为黄色。

问题是在触摸设备上，如果用户触摸屏幕，移动手指并等待几秒钟，鼠标注射事件就不会被触发。

我如何检测它？

Answer 1

要支持触摸设备，您也需要`'touchend'`。

当从触摸点移除触摸点时触发touchend事件触摸表面。

<强>的jQuery

$('#wrapper').on('mouseup touchend', function() {
    $('#a').css('background-color', 'yellow');
});

警告：

我无法找到有关跨浏览器支持的统计信息，考虑到移动浏览器的波动性，这一点令人担忧。如果需要，您可以使用jQuery mobile这样的库，它具有等效的'tap' event。请记住，您可以使用download builder选择要下载的特定模块以消除膨胀。

警告：