jQuery Switchclass继续切换

Question

我想要做的是按一下按钮，然后转到this page上的工艺表左上角。然后，如果元素再次被点击，它会返回。我使用的具体jQuery是：

$("#sword").click(function() { 
    if ($("#sword").hasClass("s1")) { 
     $('#sword.s1').switchClass("s1", "sd1", 1000, "linear"); 
    } else if ( $("#sword").hasClass("sd1")) { 
     $('#sword').switchClass("sd1", "s1", 1000, "linear"); 
     $('#bukkit').switchClass("s1", "sd2", 1000, "linear"); 
     $('#grass').switchClass("s1", "sd3", 1000, "linear"); 
    } 
}); 

sd1低于下来，s1高于槽。正如你目前看到的那样，它会反弹，然后立即反弹回来。我已经尝试使单独的功能反弹回去，当点击.s1时，但是当我点击它时什么都不会发生。

Answer 1

刚才检查您的代码链接到页面后改为sd2。您已将两个点击处理程序绑定到#sword。你只显示第一个。您的代码如下

$("#sword").click(function() { // handler 1 
    if ($("#sword").hasClass("s1")) { 
     $('#sword.s1').switchClass("s1", "sd1", 1000, "linear"); 
    } else if ($("#sword").hasClass("sd1")) { 
     $('#sword').switchClass("sd1", "s1", 1000, "linear"); 
     $('#bukkit').switchClass("s1", "sd2", 1000, "linear"); 
     $('#grass').switchClass("s1", "sd3", 1000, "linear"); 
    } 
}); 

// a few lines later  

$("#sword").click(function() { // handler 2 
    $('#sword').switchClass("s1", "sd1", 1000, "linear"); 
    $('#bukkit').switchClass("s1", "sd2", 1000, "linear"); 
    $('#grass').switchClass("s1", "sd3", 1000, "linear"); 
}); 

点击剑执行处理1，然后再处理2。如代码清晰，处理程序1个移动它，处理2带来了下来。

如果你解释你为什么写第二个处理程序，我可能会帮助更多。

Answer 2

尝试重新整理你的switchClass类ID sword的它改变从sd1到s1

$("#sword").click(function() { 

    if ($("#sword").hasClass("s1")) { 
     $('#sword.s1').switchClass("s1", "sd1", 1000, "linear"); 
    } else if ( $("#sword").hasClass("sd1")) { 
     $('#bukkit').switchClass("s1", "sd2", 1000, "linear"); 
     $('#grass').switchClass("s1", "sd3", 1000, "linear"); 
     $('#sword').switchClass("sd1", "s1", 1000, "linear"); 
    } 

});