在AJAX请求后刷新jQuery代码

Question

在AJAX请求后刷新jQuery代码

Sim*_*one 4 javascript ajax jquery request

比方说,例如,我有一些按钮在单击时调用AJAX请求.

$(document).ready(function(){
    $('button').each( function() {
        $(this).click( function() {
                    alert('Clicked.');
            // ...AJAX request...
        });
    });
});

Run Code Online (Sandbox Code Playgroud)

当我点击一个按钮时,一切正常.

但是如果我用AJAX请求加载按钮然后点击它们,上面的代码就会停止工作.

我怎么能摆脱这个？

我试过这个on()方法

$(document).ready(function(){
    $('button').each( function() {
        $(this).on('click', function() {
                    alert('Clicked.');
            // ...AJAX request...
        });
    });
});

Run Code Online (Sandbox Code Playgroud)

但它也是一样的.正常工作,不适用于加载AJAX的内容.

我被卡住了,请帮助我.

PS:我使用的是最新版本的jQuery(v1.7.1).

Answer 1

Nic*_*tti 8

你应该做:

$(document).ready(function(){
       $('body').on('click','button', function() {
                    alert('Clicked.');
            // ...AJAX request...
        });
});

Run Code Online (Sandbox Code Playgroud)

这种方式是body处理元素上所有click事件的<button>元素,即使它们是通过AJAX添加的,它也能工作.

而不是使用<body>标签你可以使用包装那些的东西<button>......在任何情况下都读取on()的jQuery文档,它非常简单.

如果你想知道PS,live()就像我使用的那样on(),jQuery只是在它们冒泡DOM时拦截事件

归档时间：	13 年，10 月前
查看次数：	4313 次
最近记录：	13 年，10 月前