动态添加的类上的事件

Question

我有一个表单，其中按钮的类动态地改变，取决于请求的来源。我试图捕获onclick事件，但它没有采用动态添加的类。我确保将该类添加到按钮中。我哪里可能出错。

片段 -

   $('.button').removeClass('oldClass');
   $('.button').addClass('newClass');

   <button class = "button">Button</button>

OnClick -

     $('.newClass').click(function(){
          alert("test");
     });

虽然按钮类已更改为newClass，但代码无法访问此事件。

由于

Answer 1

这就是当你绑定click事件时元素有另一个类。

尝试这样的事情：

$('body').on('click', '.newClass', function () {
        alert('test');
    });

Example

Answer 2

通过.bind（或.click等快捷方式）等方法设置事件处理程序，仅为当前与选择器匹配的元素设置。如果要为当前匹配的元素以及将来的所有匹配设置事件处理程序，则应使用.on。

Answer 3

您可以尝试在加载DOM时直接将按钮功能添加到按钮，并使用.hasClass()检查是否已应用newClass。

$('.button').click(function() {
    if($(this).hasClass('newClass')) {
        //Code for new class click
        alert('test');
    }
});

JSFiddle：http://jsfiddle.net/yRySK/1/

Answer 4

我使用JQuery提供的委托方法修复了问题。

$('body').delegate('.newClass','click', delegatefunction);

function hasClass() {
   alert("Hello!!");
}

感谢您的帮助。