jquery开关问题

Question

我有一个按钮，它是动态生成的。最初，当你点击班级更改为“不活动”时，它有“活动”类。当你再次点击它应该改变为活动。

因此，我使用下面的代码分配了点击事件。

$(".active").on("click",function(){ 
$(this).removeClass('active').addClass('inactive'); 
}); 

$(".inactive").on("click",function(){ 
$(this).removeClass('inactive').addClass('active'); 
}); 

问题是每次调用第一个函数。当我使用live而不是它时，它工作正常。我怎样才能解决这个问题。

Answer 1

你不能简单地改变.live到.on，

$(selector).live(event_type, function(){});

是相同

$(document).on(event_type, selector, function(){});

$("body").on("click", '.active', function(){ 
    $(this).removeClass('active').addClass('inactive'); 
}); 

$("body").on("click", '.inactive', function(){ 
    $(this).removeClass('inactive').addClass('active'); 
}); 

Answer 2

一种选择，这将需要在HTML中的微小的变化会是这样的：

$(function(){  
    $(".toggle").on("click", function(){ 
     $(this).toggleClass("active").toggleClass("inactive"); 
    });  
}); 

这将影响到分配了一个toggle类的所有元素，并假定它最初要么inactive或active。

Answer 3

试试jquery的toggleClass方法。

我写了一个演示here演示了两种实现链接相同的方法。你可以为按钮做同样的事情。