Question

我对一些基本的jQuery有一个小/（奇怪的？）问题。在HTML表单中，我有两个元素：

<label for="service-webdesign">
     <input type="checkbox" name="service-web" id="service-webdesign" value="Webdesign" />
     <span id="service-webdesign-span">Webdesign</span>
</label>
<label for="service-SEO" title="Search Engine Optimization">
     <input type="checkbox" name="service-web" id="service-SEO" value="SEO" />
     <span class="service-SEO-span">SEO</span>
</label>

现在，我想要做的是添加/删除一个名为“active”的类，以便在命中时将这些元素中的任何一个设置为不同。这是实现它的jQuery：

$('#service-webdesign').click(function(){
    if($('#service-webdesign-span').hasClass('active')){
        $('#service-webdesign-span').removeClass('active')
        } else ($('#service-webdesign-span').addClass('active'))
    });

$('#service-SEO').click(function(){
    if($('#service-SEO-span').hasClass('active')){
        $('#service-SEO-span').removeClass('active')
        } else ($('#service-SEO-span').addClass('active'))
    });

虽然它们都是相同的（功能明智），但只有第一个按预期工作。我确信这与他们的顺序无关，因为交换jQuery并没有任何区别。我刚刚在昨天开始使用jQuery，所以我可能没有能力看到这种行为。

非常感谢任何帮助！

Answer 1

service-SEO-span是一个类，但service-webdesign-span是一个id，你将它们作为id瞄准它们。

Answer 2

您应该使用toggleClass

你应该使用Juhana在评论中提到的正确的选择器！

$('#service-webdesign-span').toggleClass('active');

jQuery add / remove类只能运行一次

2 个答案: