Question

我尝试创建一个单击按钮的功能，添加一个名为active的类。但是，如果该类中还包含amd或intel，我还希望添加另一个类。我似乎无法正确理解我的语法，有人可以帮助我解决我在这里做错了什么吗？非常感谢！

$(function() {    
    $(".button").click(function() {  
        if ( $(".button").hasClass("amd") ) {
            $(this).toggleClass("amdactive"),
                $(this).toggleClass("active").siblings().removeClass('active'); }
        else if ( $(".button").hasClass("intel") ) {
            $(this).toggleClass("intelactive"),
                $(this).toggleClass("active").siblings().removeClass('active'); }
        else $(this).toggleClass("active").siblings().removeClass('active');    
  });
});

我现在实际修复了代码，但出于某种原因，intelactive类应用于所有.buttons，而不仅仅是包含amd的。有什么理由吗？

最终代码，感谢您的帮助

$(function() {    
$(".button").click(function() {  
    if ( $(this).hasClass("amd") ) {
        $(this).toggleClass("amdactive"),
        $(".intel").removeClass("intelactive"),
        $(this).toggleClass("active").siblings().removeClass('active'); }
    else if ( $(this).hasClass("intel") ) {
        $(this).toggleClass("intelactive"),
        $(".amd").removeClass("amdactive"),
        $(this).toggleClass("active").siblings().removeClass('active'); }
    else {$(this).toggleClass("active").siblings().removeClass('active');};    
  });
});

Answer 1

首先，您在语法错误中使用圆括号而不是if / else块

中的od花括号

其次你应该在课堂上用“this”来检查。你正在检查所有按钮

$(function() {    
$(".button").click(function() {  
    if ( $(this).hasClass("amd") ) {
        $(this).addClass("amdactive"),
        $(this).toggleClass("active").siblings().removeClass('active'); }
    else if ( $(this).hasClass("intel") ) {
        $(this).addClass("intelactive"),
        $(this).toggleClass("active").siblings().removeClass('active'); }
    else {$(this).toggleClass("active").siblings().removeClass('active');};    
  });
});

此外，您不是在点击其他按钮时删除amdactive类，所以如果所有点击一次都有amdactive类

所以你需要做一些像

这样的事情

$(this).addClass("intelactive");
 $(".button").not($(this)).removeClass("intelactive");

使用if语句向类添加类时遇到麻烦

1 个答案: