点击后添加一个css类答案

【问题标题】：add a css class after click点击后添加一个css类
【发布时间】：2013-08-08 22:16:28
【问题描述】：

我希望能够在用户单击 href 元素时添加一个类 addclass。我正在使用咖啡脚本。有什么建议吗？

<div class="visual-tabs">
    <ul id="myTab" class="nav nav-tabs event-type">
        <li>
            <a class="form-scores">Test</a>
        </li>
        <li>
            <a class="form-scores">Test 2</a>
        </li>
    </ul>
</div>

这是我目前所拥有的：

$(document).on 'click', "#myTab .nav-tabs li a", (e) ->
  $(this).addClass('selected')

【问题讨论】：

标签： jquery coffeescript

【解决方案1】：

从您的选择器中删除 .nav-tabs，它正在搜索 #myTab 的子项。这也有点多余，您已经选择了一个唯一的 ID。

$(document).on 'click', "#myTab li a", (e) ->

【讨论】：

【解决方案2】：

问题在于您的选择器。通过按照您的方式编写选择器，您正在寻找一个类为 nav-tabs 的元素，它是 ID 为 myTab 的元素的子元素。

所以，"#myTab .nav-tabs li a" 需要为#myTab.nav-tabs li a 或简化为".nav-tabs li a" 或"#myTab li a"

发生这种情况的原因是因为#myTab CSS 选择器以ul 为目标，从而导致它查找具有nav-tabs 类的元素，该元素是ul 的子元素（不是你的意图）。

这就是组合这两个选择器可以解决问题的原因（例如#myTab.nav-tabs）。这样做会导致它查找具有这两个类的任何元素，然后查找属于它的子类的任何 li。

【讨论】：