无法让JS定位到特定目标

Question

我不是程序员。 我可以阅读和理解一些代码，也可以在Google上找到答案。 但是这个逃脱了我。 我建立了一个测试页来尝试为移动设备编码-http: //www.stovebolt.com/testing2.html

在800像素处，左侧的导航堆栈被隐藏并被下拉菜单取代，该下拉菜单使用具有悬停功能的列表结构。 如果父级li的href为＃，这将在移动设备上起作用。 但是，您必须重新加载页面才能使其关闭菜单。

因此，我寻求解决方案并遇到了这个问题： http : //osvaldas.info/drop-down-navigation-sensitive-and-touch-friendly

我正在使用他的DoubleTapToGo javascript，它可以工作，但它不仅适用于父级li，还适用于所有元素。 根据他的页面，您只需要使用以下内容即可让父项需要双击：

$( '#nav li:has(ul)' ).doubleTapToGo();

我没有使用ID #nav。 我使用的是.mobile类，所以我将#nav替换为.moblie。 但是您必须双击所有链接，而不仅仅是下拉列表。

我试过否定函数，但这没有用。 我尝试更改为li：hasClass（）并为那个li创建了一个新类。 没用 我如何才能使Doubleclick仅在父级li上起作用？ 代码li：has（ul）应该可以工作，因为只有一个子列表。 但事实并非如此。

我忍不住想想我缺少一些非常简单的东西。 这是我页面上的代码，我直接从他的网页源代码中复制了这些代码：

<script>
    $( function()
    {
            $( '.mobile li:hasClass('mobileParent')').DoubleTapToGo();
    });

这是移动列表的html：

<div class="mobile" role="navigation">
<ul>
<li><a href="<!--#echo var="DOCUMENT_URI" -->" aria-haspopup="true">Around the 'Bolt...</a>
<ul>
<li><a href="http://www.stovebolt.com/">Home</a></li>
<li><a href="http://www.stovebolt.com/search.html">Search</a></li>
<li><a href="http://www.stovebolt.com/ubbthreads/ubbthreads.php">Discussion Forums</a></li>
<li><a href="http://www.stovebolt.com/gallery">Gallery</a></li>
<li><a href="http://www.stovebolt.com/techtips/">Tech Tips</a></li>
<li><a href="http://www.stovebolt.com/links">Links</a></li>
<li><a href="http://www.stovebolt.com/events">Events</a></li>
<li><a href="http://www.stovebolt.com/ubbthreads/ubbthreads.php/category/3/Swap_Meet.html">Swap Meet</a></li>
<li><a href="http://www.stovebolt.com/faq/">FAQs</a></li>
<li><a href="http://www.stovebolt.com/features">Features</a></li>
<li><a href="http://www.cafepress.com/mystovebolt" target="_blank">Stovebolt Hoo-ya</a></li>
<li><a href="http://www.stovebolt.com/office">Stovebolt Office</a></li>
</ul>
</li>
</ul>
</div>

Answer 1

请尝试这个

$( function()
{
        $( '.mobile li.mobileParent').DoubleTapToGo();
});

但是在您的html中，类mobileParent不存在li 。 因此$( '.mobile li.mobileParent').DoubleTapToGo(); 不会工作。 添加该校准，然后使用此代码。

Answer 2

这就是我解决问题的方式。 我删除了所有双击的东西（因为它给了我错误），将主LI中的链接更改为“＃”，并在下拉菜单中添加了另一个LI以将其关闭：

<li><a href="#" aria-haspopup="true">Around the 'Bolt...</a> <ul> <li><a href="<!--#echo var="DOCUMENT_URI" -->">Close this Menu</a></li>

这只是一个问题。 显然，Apple试图模拟悬停事件，因此它需要双击下拉菜单项。 因此，我在以下脚本中添加了该脚本： http : //cssmenumaker.com/blog/solving-the-double-tap-issue-on-ios-devices