当您在相同元素上使用这两个类时,您的代码是多余的,不需要“实时”事件
由于我们不使用“live”事件,jquery 将永远不会更新选择器所针对的元素,因此如果将来它们与原始选择器不匹配,则单击事件将继续对它们起作用
$(".open").click(function(){
alert("click!");
}).removeClass("open");
对于您的特定情况,首先您需要一个用于所有元素的选择器,如果在开始时所有元素都已打开,则使用 $(".open") 如果它是 mixin,则使用 $(".open, .close"),并且当然必须有更好的选择器,例如 $("#parent > article") 只需检查您的 html 即可
在这里我们没有得到你的 html,所以我假设它是一个 mixin,$(".open, .close")
我们需要检查当前类并做了不同的动作,jquery get 函数来检查一个类
$(this).hasClass("open");
或者
$(this).is(".open");
=>
$(".open, .close").click(function(){
var isOpen = $(this).hasClass("open");
if(isOpen) alert("opened!"); else alert("closed!");
});
使用您当前的代码:
$(".open, .close").click(function(){
var $t = $(this);
var isOpen = $t.hasClass("open");
if(isOpen){
$('#rslide').animate({right:-375},400);
$t.removeClass('open').addClass('close');
} else {
$('#rslide').animate({right:0},400);
$t.removeClass('close').addClass('open');
}
});
但它仍然是一些冗余代码,让我们更简化一下:
$(".open, .close").click(function(){
var $t = $(this);
var isOpen = $t.hasClass("open");
$('#rslide').animate({right:(-375*isOpen)},400);
$t.toggleClass('open').toggleClass('close');
});
toggleClass 肯定不是很好,必须先检查类,去掉试试
$(".open, .close").click(function(){
var $t = $(this);
var isOpen = $t.hasClass("open") * 1;
var cls = ["open","close"];
$('#rslide').animate({right:(-375*isOpen)},400);
$t.removeClass(cls[!isOpen]).addClass(cls[isOpen]);
});