删除并添加类并单击它们

Question

<div id='menuT'>
<div class='goAct' id='home'>Home</div>
<div class='goPass' id='about'>About</div>
<div class='goPass' id='links'>Links</div>
</div>

JS

$('.goPass').click(function () {
alert ('323');
$('.goAct').removeClass().addClass('goPass');
$(this).removeClass().addClass('goAct');
});

点击#about和#links正常工作，即正确切换课程并显示提醒。在调试窗口中，我看到#home变为.goPass。

但是点击#home不起作用。没有任何事情发生。

Answer 1

由于您要动态更改元素的classes，因此您必须使用event delegation，

$(document).on('click','.goPass',function (){ 
    alert('hello'); 
});

请阅读 here 以了解有关活动委派的更多信息。

Answer 2

您需要使用on，如下所示：

$('#menuT').on('click', '.goPass', function(){
     alert('323');
     $('.goAct').removeClass().addClass('goPass');
     $(this).removeClass().addClass('goAct');
});