4

我正在使用 jQuery 来管理我正在编码的应用程序评论上的“编辑”按钮。在我的document.ready，我有：

$('.edit-button').click(function(){
// Code to trigger the editing interface for parent comment
});

我还使用 jQuery 来显示新发布的评论而不刷新页面。在相关$.ajax()函数中，我使用$.before(data). 问题是，.edit-button里面的 sdata没有上述$.click()适用于他们，因为那发生在document.ready. 所以我点击它们，没有任何反应。

我已经尝试过让 Ajax 函数重新包含我调用的 .js 文件的（非常丑陋的）解决方案document.ready。这行得通，除了它重新应用.click()到每一个.edit-button，所以他们打开编辑界面两次（甚至三次）。

那么，我怎样才能重新申请$.click()s from document.ready？最好不必将我的document.ready函数复制到另一个 javascript 文件中，以防我以后修改它。

4

4 回答 4

8

取决于您的 jQuery 版本，有以下解决方案：

$(selector).live(events, data, handler);                // jQuery 1.3+
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(document).on(events, selector, data, handler);        // jQuery 1.7+

显然最后一个.on()是最好的选择。更多信息。

但关于.bind()：

从 jQuery 1.7 开始，该.on()方法是将事件处理程序附加到文档的首选方法。对于早期版本，该.bind()方法用于将事件处理程序直接附加到元素。处理程序附加到 jQuery 对象中当前选定的元素，因此这些元素必须存在于调用发生的点.bind()。参考

对于您的问题，答案是这样的：

$('.edit-button').on("click",function(){  })

或者

$(document).on("click", ".edit-button", function(){  });

注意：.live()不再推荐使用该方法，因为更高版本的 jQuery 提供了没有缺点的更好方法。更多信息

.live()jQuery 1.9 升级后删除了更新

于 2012-05-01T06:58:38.260 回答
4

试试这个

$('body').on("click", ".edit-button", function(){

})

你也许可以用更有针对性的东西来改变身体选择器。

于 2012-05-01T06:37:04.840 回答
2

由于您使用的是 AJAX，因此您需要使用“live()”API。

$('.edit-button').live("click", function(){
// Code to trigger the editing interface for parent comment
});
于 2012-05-01T06:45:38.163 回答
0

采用

$('.edit-button').bind('click', function() {
// Code to trigger the editing interface for parent comment
});

或者在评论发布后在您的 ajax 成功函数中添加它：

$.ajax({
    url: "some url",
    // ...
    success: function (data) {
        //comment posted successfully
        $('.edit-button').unbind("click");
        $('.edit-button').bind("click", editButtonClickHandler);
});

function editButtonClickHandler () {
    //.. handle click
}
于 2012-05-01T06:43:23.210 回答