如何更改点击事件的类别答案

【问题标题】：How to change class on click event如何更改点击事件的类别
【发布时间】：2012-07-30 11:49:36
【问题描述】：

我试图在点击事件中更改分配给元素的 CSS 类，但看不到在我的情况下我必须使用哪个选择器。看到我有一个 DL，里面有一些 DD，第一个 DD 有 class="active"，当我选择任何其他 DD 并将该类分配给拾取的 DD 时，我需要删除这个类，明白吗？一个小例子：

<dl>
  <dd class="active">DD1</dd>
  <dd>DD2</dd>
  <dd>DD3</dd>
</dl>

如果我选择 DD2，那么 class="active" 应该会从 DD1 消失并移至 DD2，依此类推。我认为在使用 :eq() 但虽然不起作用。有什么建议或帮助吗？

编辑：样品准备好了！！转到http://comvivem.treswd.com/net/ 并以 demo/demo123 身份登录，然后转到“Directorio”，您将看到过滤器和字母“A”、“B”等旁边，因为您可以看到 A 是默认值并且具有活动类但选择“ B" 或任何其他，看看发生了什么，这就是我之前提到的！

干杯和感谢

【问题讨论】：

粗略研究会为此提供大量资源。你搜索了吗？查看 jQuery 的 on() 和 toggleClass() 方法。
当然，我在这里问之前做过研究，但我的代码无法正常工作，因为我寻求帮助@Utkanos

标签： jquery jquery-plugins jquery-selectors

【解决方案1】：

$('dd').on('click', function() {
    $(this).addClass('active').siblings().removeClass('active');
});

FIDDLE

【讨论】：

非常罕见，因为您的代码在 JSFiddle 上可以工作，但我的不行，我只是复制和粘贴其他内容！我会在几分钟后将文件上传到某个地方并在此处留下链接

【解决方案2】：

此 JavaScript 确实会在点击时更改链接，但在您的场景中这不是必需的：

$("dd").click(function(){
    $("dd").removeClass("active");
    $(this).addClass("active");
});

你应该这样做：

$(document).ready(function(){
    var letter = window.location.pathname.slice(-1);
    $("dd").removeClass("active");
    $("dl.sub-nav dd a:contains("+letter+")").parent().addClass("active");
});

还是很hacky，最好在服务器端脚本中将class设置为当前选择的字母。

【讨论】：

它可以工作，但只是暂时的，因为活动类回到第一个元素，这意味着 DD1 与其他代码相同
我不明白。如果单击活动元素本身，是否要删除该类？
不，我不想从第一个 DD1 的默认元素中删除该类，并分配给单击的元素，意思是 DD2 或 DD3，如果是这样的话，甚至是 DD1
好的，现在我知道发生了什么。单击后，页面将完全重新加载，并且您通过 JavaScript 所做的更改不再适用。我会把我的答案编辑成对你有用的东西。