我正在尝试编辑这段代码,在我点击的元素上添加一个“活动”类,当我点击导航的另一个项目时自动删除它...
var firstTime = true;
$("#nav a").click(function() {
var divname = this.name;
$(this).addClass( "active", "fast", "easeOutBounce" );
if (!firstTime) {
if ($(".slid").hasClass(divname)) {
firstTime = true;
$(".slid").removeClass("slid").slideUp();
} else {
$(".slid").removeClass('slid').slideUp(500, function() {
$("." + divname).slideToggle().addClass("slid");
});
}
} else {
$("." + divname).slideDown().addClass("slid");
firstTime = false;
}
});
我应该在哪里添加.removeClass(“有效”)以使其工作......?
由于
答案 0 :(得分:0)
就这样做
var firstTime = true;
$("#nav a").click(function() {
var divname = this.name;
//Remove existing 'active' class
$('.active').removeClass('active');
$(this).addClass( "active", "fast", "easeOutBounce" );
[...]
答案 1 :(得分:0)
var firstTime = true;
$("#nav a").click(function() {
var divname = this.name;
$('#nav a.active').removeClass('active');
$(this).addClass( "active", "fast", "easeOutBounce" );
if (!firstTime) {
if ($(".slid").hasClass(divname)) {
firstTime = true;
$(".slid").removeClass("slid").slideUp();
$('#nav a.active').removeClass('active');
} else {
$(".slid").removeClass('slid').slideUp(500, function() {
$("." + divname).slideToggle().addClass("slid");
});
}
} else {
$("." + divname).slideDown().addClass("slid");
firstTime = false;
}
});
答案 2 :(得分:0)
我认为最好的方法是检查它是否有效,并且只在这种情况下,更改活动元素。
这样,您的解决方案将更具性能。
if (this.className.indexOf('active') == -1) {
//remove class from actual selected
var selected = $('#nav a.active');
selected.removeClass( "active").text('');
// add class here
$(this).addClass( "active", "fast", "easeOutBounce" );
$(this).text('active');
} else {
$(this).removeClass( "active").text('');
}
试试here一个有效的例子