检测 ul 列表内容变化 jQuery

Question

我们有一个 ID 为#some-list 的无序列表。在我们的 Backbone 实现中，当返回某些数据时，将呈现列表条目并将其附加到列表中，然后显示列表。

我们想要使用 JQuery 检测此类更改何时完成。我们使用了 $(#some-list).ready() 和 $(#some-list).load()，但看起来它们不起作用。

有哪些方法可以捕捉到这种变化？有人可以在这里点灯吗？

Answer 1

嗯，你没有 post 任何代码，所以很难猜出你在哪里失败了。
但总的来说，我会做的是在 ajax 回调上触发一个自定义事件（你确实使用 ajax 来获取内容并将其附加到列表中吧？）。

例如：

loadData(){
  // invoke the ajax request
  var def = $.get(...);
  def.then(function(result){
    // $(#ul) append(result) ...  
    // now trigger the custom event  
    $(document).trigger('listRendred');
  });
}

现在您可以在不同的地方或脚本上收听它：

$(document).on('listRendred', function(e){ // do what ever... })

Answer 2

由于您使用的是 BackboneJS，因此您可以尝试监听它的事件。

要找出您可以使用哪些事件，请尝试使用以下代码（首先替换我的 * 占位符）并查看浏览器的控制台。

*backboneobject*.on("all", function(e) {
  console.log(e)
});

之后只需使用

监听事件

*backboneobject*.on("*yourevent*", function() {
  doStuff();
});

检测 ul 列表内容变化 jQuery

Detect ul list content change jQuery

html

javascript

jquery

backbone.js