Question

我试图使用jQuery为我的网站创建一个虚假的悬停事件...

我创建了以下内容，只有列表中的所有子元素现在返回false，而不是链接到正确的页面...

if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))) {
    $("ul.sf-menu li.i").click(function(e) {
        e.preventDefault();
    });
}

有人对可行的替代方法有所了解吗？

HTML

<ul class="sf-menu"> <li><a href="index.html">Home</a><li class="i"><a href="wedding-hire.html">Weddings</a>
            <ul>
                <li><a href="peel-suite.html">Peel Suite</a></li>
                <li><a href="the-hall.html">The Hall</a></li>
                <li><a href="the-grounds.html">The Grounds</a></li>
                <li><a href="food-and-drink.html">Food &amp; Drink</a></li>
                <li><a href="pricing.html">Pricing</a></li>
            </ul>
        </li>

Answer 1

好。没有HTML它很难说。但是当用户点击li时，你正在停止浏览器的默认行为（因此也就是它的子节点，我认为它是一个锚点/链接）。您可以检查点击时是否有链接或锚点，并以不同方式处理它;

$("ul.sf-menu li.i").click(function(e) {
    if (e.target.nodeName!=="A"){
        e.preventDefault();
        //do your hover code
    }
    else{
        //do nothing, because the user wants the link to load
    }
});

Answer 2

更改你的选择器所以它只匹配第一级列表点，我也没有看到类i，所以你可能需要从选择器中删除它。

$("ul.sf-menu > li")

Ipad悬停事件jQuery

2 个答案: