如何防止我的触摸设备执行::悬停而不是单击功能

How do I prevent my a touch device from executing an ::hover instead of a click function?

本文关键字：悬停 功能 单击 执行 我的 何防止 触摸      更新时间：2023-09-26

好吧，这可能是一个常见的问题，但我现在还没有找到解决方案。

我的网站上有一个互动程序，实际上是一个div容器，如果我从触摸设备中点击它，我想在其中添加一个"触摸"类。

一切都很好，除了第一次点击时，它不执行我的点击功能，而是：：悬停。第一次敲击后，一切如预期。

这是一些代码

function init() {
        $tile.on('click', toggleTouchClass );
    }
function toggleTouchClass(){
        if( $('html').hasClass('isTouch') ){
            $tile.toggleClass('touched');
        } else{
            return
        }
    }

init是在文档准备好的时候调用的。

提前谢谢。

您应该订阅触摸设备上的touchstart事件：

var isTouchDevice = ... // You can check ontouchstart in window object or use Modernizr.touch to set this
$tile.on(isTouchDevice ? 'touchstart' : 'click', function() {
    ...
});
相关文章：