0

我的 HTML 代码为；

<a href="someTarget.html" class="menuLink">Link</a>

现在之前的 JS 代码是；

$(".menuLink").mouseover(function(){
    //code for show() submenu
}


$(".menuLink").mouseout(function(){
    //code for hide() submenu
}

我正在 iPad 上对此进行测试，上面的代码在 iPad 上运行良好（即在第一次点击时，它会触发悬停事件并显示子菜单，并且只有在下一次点击时才会触发点击事件或转到目标链接）

出于某种原因（向主菜单添加延迟），我不得不按如下方式更新代码；

$this.hover(
    function(){ // over
        $this.data("timer", setTimeout(show, 500));
    },
    function(){ // out
        $this.data("timer", setTimeout(hide, 500));
    }
)

所以问题如下；在第一次点击链接时，它会立即将用户带到目标 URL（而不是之前的 2 次点击以悬停/单击）

请帮我解决这个问题。

4

2 回答 2

0

移动设备不支持鼠标悬停事件，也不支持双击事件

于 2012-06-11T11:13:41.053 回答
0

jQuery文档说这$(selector).hover(handlerIn, handlerOut)只是使用$(selector).mouseenter(handlerIn).mouseleave(handlerOut).

这意味着没有mouseover()/mouseout()事件绑定到该对象，并且移动浏览器可能无法正确处理其他 2 个事件（即mouseenter()/ mouseleave()）。

尝试将您的代码替换为：

$this.mouseover(function(){ // over
        $this.data("timer", setTimeout(show, 500));
    }).mouseout(function(){ // out
        $this.data("timer", setTimeout(hide, 500));
    }
)

让我知道这是否有用。

于 2012-06-11T10:31:54.963 回答