单击后添加一个css类

Question

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

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

Answer 1

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

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

Answer 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类的元素，该元素是{ {1}}（这不是你想要的）。

这就是为什么组合这两个选择器可以解决问题（例如ul）。这样做会导致它查找包含这两个类的任何元素，然后查找属于它的任何#myTab.nav-tabs。