Question

我想在单击项目时向列表项添加一个类。我做了一些研究，仍然无法正确添加课程。谢谢！

编辑：我在asp.net中使用了一个主页

<ul id="menu">
      <!-- put class="selected" in the li tag for the selected page - to highlight which page you're on -->
      <li><a id="default" href="Default.aspx">Home</a></li>
       <li><a id="projects" href="Projects.aspx">Projects</a></li>
      <li><a id="blogs" href="Blogs.aspx">Blogs</a></li>
      <li><a id="photos" href="Photos.aspx">Photos</a></li>
       <li><a id="resume" href="Resume.aspx">Resume</a></li>
      <li><a id="contacts" href="Contact.aspx">Contact</a></li>
    </ul>

<script type="text/javascript" language="javascript">
   $(document).ready(function () {
       $('ul.menu li a').click(function () {
           $(this).parent().addClass('selected');
       });
   });

ul#menu li a:hover, ul#menu li.selected a, ul#menu li.selected a:hover

{color：#FFF; 背景：＃1C2C3E url（menu_select.png）repeat-x;}

Answer 1

您的选择器不正确。 ul.menu表示带有menu类的ul 在查找ID时，只需使用$("#menu")

即可

另外，您可能想看一下@DefyGravity和@Joseph Silber给出的答案。他们建议，如果你不阻止默认点击事件，用户的浏览器只会跟随链接，用户永远不会真正看到添加的类，因为它们将被导航到不同的页面。

Answer 2

将您的jQuery更改为：

$(document).ready(function () {
    $('ul#menu li a').click(function (e) {
        $(this).parent().addClass('selected');
        e.preventDefault();
    });
});

你有ul.menu指的是一类菜单，你在标签上有一个菜单ID

Answer 3

您必须返回false，否则浏览器只会跟随链接：

 $(document).ready(function () {
       $('ul#menu li a').click(function () {
           $(this).parent().addClass('selected');
           return false;
       });
 });

Answer 4

你的选择器中有一个拼写错误，ul.menu会查找带有“类”菜单的无序列表。你的html说明无序列表有一个菜单ID。您可能还想要'event.preventDefault（）'：

    <script type="text/javascript" language="javascript">
           $(document).ready(function () {
               $('#menu li a').click(function (event) {
     event.preventDefault();
                   $(this).parent().addClass('selected');
// also think about removing the class 'selected' from all the other links.
  $(this).parent().siblings('.selected').removeClass('selected');
               });
           });
        </script>

单击锚点时Jquery更改css类

4 个答案: