Jquery在单击achor时更改css类

我试图在单击列表项时将类添加到列表项中。我做了一些研究，仍然无法正确添加类。谢谢

编辑：我正在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');
       });
   });

{颜色：#FFF；

---

背景：#1C2C3E url（menu_select.png）repeat-x；}

您的选择器不正确<代码>ul。菜单指具有类别

菜单

的ul
查找id时，只需使用

$（“#菜单”）

此外，您可能想看看@DefyGravity和@Joseph Silber-

---

他们建议，如果不阻止默认的单击事件，用户的浏览器将只跟随链接，用户将永远看不到添加的类，因为它们将被导航到不同的页面

将jQuery更改为：

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

---

您有

ul.menu

，它指的是一类菜单，当您在标签上有一个menu的ID时，您必须返回false，否则浏览器只会跟随链接：

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

---

您的选择器中有一个输入错误，ul.menu查找带有“类”菜单的无序列表。您的html声明未排序列表具有菜单ID。您可能还需要“event.preventDefault（）”：

$（文档）.ready（函数（）{
$（“#菜单a”）。单击（函数（事件）{
event.preventDefault（）；
$（this.parent（）.addClass（'selected'）；
//还要考虑从所有其他链接中删除类“selected”。
$（this）.parent（）.sides（'.selected'）.removeClass（'selected'）；
});
});

Sjonny是第一位，+1，强烈建议使用“防止默认值”。（可选）从同级

中删除“选定”类。然后如何更改页面？您应该根据当前页面在加载时（而不是单击链接时）添加“选定”类。请参见此处接受的答案：如果阻止默认设置，如何更改页面？

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

    <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>