Question

我有以下代码，在使用触摸屏设备时，第二次点击时链接处于活动状态。

代码改编自：

（function（$）{

var landingLink = '.nav-landing > li';

if (('ontouchstart' in window) || (navigator.maxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0)) {

    // DISPLAY LANDING PAGE MEGA NAV ON TOUCH
    $(landingLink).live('touchstart', function (e) {

        var link = $(this);
        var megaDiv = $(this).find('div');

        // REMOVE touch-device CLASS IF NAV LINK HASN'T BEEN TAPPED
        if (!megaDiv.hasClass('touch-device')) {
            $('.touch-device').removeClass('touch-device');
        }

        if (link.hasClass('hover')) {
            // SECOND TOUCH
            return true;
        } else {
            // FIRST TOUCH
            link.addClass('hover');
            megaDiv.addClass('touch-device');
            $(landingLink).not(this).removeClass('hover');
            e.preventDefault();
            return false;
        }
    }); 
}

}）（jQuery的）;

jsfiddle.net

我试图设置它，以便在点击链接时（第一次点按）链接旁边会显示带有.touch-device类的div元素但我在删除.touch-时遇到问题 - 设备类，如果再点击另一个链接。我无法弄清楚如何定位div以移除类触摸设备＆＃39;。

我的代码示例可在以下网址找到：

我真的很感激帮助解决这个问题。

Answer 1

只需从html代码中删除整个代码中的触摸设备类。在函数的第一行添加此行：

$('.touch-device').removeClass('touch-device');

使用jQuery在触摸屏设备上模拟悬停

1 个答案: