Question

我目前正在我的网站上集成bootstraps scrollspy - 而且我也在使用这样的菜单：http://development.tobypitman.com/css/menu.html

现在 - 我可以在导航中定位我的李 - 但我想要的是定位李。

    selector = this.selector
      + '[data-target="' + target + '"],'
      + this.selector + '[href="' + target + '"]'

    active = $(selector)
      .parent('li')
      .addClass('active')

任何人？

Answer 1

也许这样的事情会起作用吗？

active = $(selector)
      .parent('li')
      .find('a')
      .addClass('active')

Answer 2

您也可以使用：

active = $(selector)
    .parent('li')
    .children('a')
    .addClass('active');

Answer 3

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('.MenuLList').find('a.Testing').hover(function () { $(this).addClass('Active'); }, function () { $(this).removeClass('Active'); });
        });
    </script>
    <style type="text/css">
        .MenuLList
        {
            list-style: none;
        }

        .MenuLList li
        {
            margin: 5px 0px;
        }

        .MenuLList li a
        {
            text-decoration: none;
        }

        .Inactive
        {
            color: Red;
            width: 100px;
            background-color: Yellow;
        }

        .Active
        {
            font-weight: bolder;
            color: Green;
            width: 300px;
            background-color: Lime;
            padding-left: 30px;
        }
    </style>
</head>
<body>
    <ul class="MenuLList">
        <li><a class="Inactive" href="#">Test 1</a></li>
        <li><a class="Testing Inactive" href="#">Test 2</a> </li>
        <li><a class="Testing Inactive" href="#">Test 3</a> </li>
        <li><a class="Testing Inactive" href="#">Test 4</a> </li>
    </ul>
</body>
</html>

jQuery / CSS - 目标li而不是li？

3 个答案: