0

我有一个 wordpress 网站，它像这样输出 ul：

<ul role="primary">
<li class="page_item page-item-7"><a href=" /services/">Services</a>
   <ul class='children'>
      <li class="page_item page-item-23"><a href=" /services/accounts-production/">Accounts Production</a></li>
      <li class="page_item page-item-25"><a href=" /services/audit/">Audit</a></li>
      <li class="page_item page-item-27"><a href=" /services/tax-planning/">Tax Planning</a></li>
      <li class="page_item page-item-29"><a href=" /services/business-startup-advice/">Business Startup Advice</a></li>
      <li class="page_item page-item-31"><a href=" /services/accounting-systems/">Accounting Systems</a></li>
      <li class="page_item page-item-33"><a href=" /services/payroll-bureau/">Payroll Bureau</a></li>
   </ul>
</li>
</ul>

我正在使用 jQuery 向 parent 的父 li 添加一个类，我需要它以便当特定的 li 悬停在子 ul 上时会显示。

$('ul[role="primary"] li ul.children li').hide();

   $('li:has(> ul)').addClass('parent').mouseover(function() {

   $(this).children().show();

});

但它不起作用，有什么想法吗？

4

2 回答 2

1

您可以尝试以下方法：

$('ul[role="primary"] li ul.children').hide();
$('ul[role="primary"] li').addClass('parent').hover(
    function(){ //mouseenter 
            $(this).find('ul').show();
    }, function(){//mouseexit
        $(this).children('ul').hide();
    });

如您所见，您可以使用 find()、children() 或任何最适合您的代码的遍历。

于 2013-09-25T15:04:27.023 回答
0

你可以在 JavaScript 中这样做

$('ul[role="primary"] li ul.children li').hide();

$('li').has('ul.children').addClass('parent').mouseover(function() {
   $(this).find('li').show();
});
$('li').has('ul.children').addClass('parent').mouseout(function() {
   $(this).find('li').hide();
});

这里是工作示例jsFiddle

第二部分是再次隐藏！

于 2013-09-25T14:38:18.947 回答