javascript - 文档准备好后如何按类名选择元素？

Question

我正在尝试通过我在 jQuery 中添加的类名来定位元素。如果我添加一个新元素，这似乎可以正常工作，但我无法将新事件绑定到已经在 DOM 中但已更改的元素。

我究竟做错了什么？

$(document).ready(function(){  
$(".activateRow").on("click",function(){
     $(this).text('Deactivate').addClass('deactivateRow btn-danger').removeClass('activateRow btn-success');
     $(this).parent().parent().removeClass('inactiveRow');
 });

$(".deactivateRow").on("click",function(){
    $(this).text('Activate').removeClass('deactivateRow btn-danger').addClass('activateRow btn-success');
    $(this).parent().parent().addClass('inactiveRow');
});

 })

Answer 1

要绑定到新元素，请使用委托：

$(document.body).on("click", ".deactivateRow", function(){

Answer 2

您的代码似乎有点乱，我建议您使用数据 api，您的元素可以使用 data-nameOfYourAttribute='Value' 设置属性。您可以像这样在 jquery 中使用它： //这是一个 getter/setter $('#myElement').data('nameOfYoutAttribute')

对于您的问题，您可以执行以下操作：

$('.myRows').on('click', function() {
    if($(this).data('activated') == false) {
       //Do stuff
       $(this).data('activated', true);
    } else {
       //Do stuff
       $(this).data('activated', false);
    };
});

希望能帮助到你