Question

需要指定ID及其更改的类名才能将其更改回来。我在HTML点唱机上的3个按钮之间切换。因此，如果在选择之后再次点击相同的按钮（摇滚） - 摇滚会变得沉默。

启动按钮的按钮操作（3个按钮中的1个）

$("a#butblue").click(function(){
    stopall();
    $.fn.soundPlay({url: '../audio/lounge.mp3', playerId: 'embed_playerB', command: 'play'}); 

    $("a#butblue").removeClass("blue_off");

    $("a#butgreen").removeClass("green_on");
    $("a#butgreen").addClass("green_off");
    $("a#butorange").removeClass("orange_on");
    $("a#butorange").addClass("orange_off");

    $("a#butblue").addClass("blue_on");
});

function stopall() {
    $.fn.soundPlay({playerId: 'embed_playerB', command: 'stop'});
    $.fn.soundPlay({playerId: 'embed_playerG', command: 'stop'});
    $.fn.soundPlay({playerId: 'embed_playerO', command: 'stop'});   
}

现在如果再次点击＃butblue.blue_on，我希望它关闭。尝试使用以下但不知何故我似乎没有连接ID和更改类名称。我可以在萤火虫中看到它们，它正在改变阶级。似乎无法掌握它。可以这样做吗？（它必须）。

$("a#butblue.blue_on").click(function(){
    stopall();  
    $.fn.soundPlay({playerId: 'embed_playerB', command: 'stop'});
    $("a#butblue").removeClass("blue_on");
    $("a#butblue").addClass("blue_off");
});

Answer 1

你不能通过检查元素是否具有类blue_or或blue_off（如果我理解正确的话）来做到这一点

$("a#butblue").click(function(){
    var btn = $(this);
    if(btn.hasClass('blue_on'){
        //do your stuff when it is on
    }else if(btn.hasClass('blue_off'){
        //do your stuff when it is off
    }else{
        //do stuff when no class has been added
    }
});

Answer 2

简单回答：从这里开始：

$("a#butblue.blue_on").click(function(){

对此：

$("#butblue.blue_on").live('click', function(){

请注意我在＃之前删除了“a”。这样做效率非常低，而且没有必要。

更好的回答：

根据您的ID进行绑定，并将按钮的状态存储在课程以外的其他内容中，例如data。即使你确实使用了一个类，也不要使用“blue_on”和“blue_off”只使用“active”的存在作为on，而不使用“active”类来关闭。然后你可以这样做：

var $button = $('#butblue');
if ($button.hasClass('active'))
 // Disable stuff
else
 // Enable stuff
$button.toggleClass('active');

您也可以重复使用这样的功能/功能：

$('#butblue, #butorange, #butgreen').click(function() {
    var $button = $(this);
    var buttonColor = $(this).attr('id').replace('but', ''); //Useful?

    if ($button.hasClass('active'))
     // Disable stuff
    else
     // Enable stuff
    $button.toggleClass('active');
});

附加到ID的JQuery ID更改类然后按ID和新类名重新获取相同的项

2 个答案: