在jQuery中执行.replaceWith()时,不会保留事件绑定

Question

这是一个简洁的例子.

请记住,.chat-reply类有一个绑定到它的click事件处理程序.

HTML(回复按钮):

<div class="container">
    <a href="#" class="btn small chat-reply">Reply</a>
</div>

当有人单击另一个向服务器发送消息以保存在数据库中的按钮时,将调用此jQuery函数.这是通过ajax完成的,并且成功完成.在前面提到的.ajax()success()回调函数中调用了这个函数:

$.ajax({
      type      :  'GET',
      url       :  '/some_controller/some_method',
      success   :  function(data) {

      $('.container').replaceWith(data);
    }
});

上面成功回调中的"数据"将替换整个 .container div,包括child .chat-reply按钮.在此replaceWith()之后,click事件不再绑定到该按钮.

从逻辑上讲,我试图让最终用户向时间线发布消息,然后在时间线中显示该消息,而无需刷新屏幕.

Answer 1

决定采用一个不太优雅的解决方案，部分归功于这篇文章：Events not registering after replacementWith

我创建了一个名为wireUpChatReply() 的函数，它将单击事件绑定到.chat-reply 按钮。

然后在replaceWith()之后，我调用wireUpChatReply()来重新绑定事件。我在 document.ready 上对wireUpChatReply 进行了同样的调用。

它不漂亮，但很有效。