監聽表格行數改變

我正在使用html表格。我的要求是，我想聽取行數的變化。無論如何要實現這一目標？監聽表格行數改變

注：我沒有在這裏添加/刪除一行功能來實現。

而且，我已經試過了，

$("#myTable>tbody>tr").watch("length", function() { 
    alert("row count changed..") 
});

但是，上面的代碼並沒有爲我工作。你們中的任何人都可以知道如何做到這一點？

在此先感謝，

-Raja。

來源

2012-03-19 Rajagopal 웃

看來OP已經嘗試使用下面的jQuery插件：http://archive.plugins.jquery.com/project/watch（'watch（「length」）'bit） – 2012-03-19 19:07:50

感謝您的回覆。是的，一點沒錯。但是，上面的代碼不起作用。你能弄清楚我的錯誤嗎？ – 2012-03-19 19:12:12

確實沒有足夠的代碼出現錯誤。這個特殊的插件在2009年被添加，並且似乎在此後被放棄。最有可能的是，它不適用於現代版本的jQuery。 – 2012-03-19 19:14:56

唯一的跨瀏覽器的方式在目前這樣做將是一個setInterval的和可能的自定義事件。

setInterval(function() { 
    var $t = $("#myTable"), 
     rowCount = $t.data("rowCount"), 
     rowLength = $t.find("tbody").children().length; 
    if (rowCount && rowCount !== rowLength) { 
     $t.trigger("rowcountchanged").data("rowCount", rowLength); 
    } 
    else if (!rowCount) { 
     $t.data("rowCount", rowLength); 
    } 

}, 50); 
$("#myTable").on("rowcountchanged",function(){ 
    alert($(this).data("rowCount")); 
});

我建議您在更改行數時手動觸發事件，而不是使用間隔（如果可能）。

UPDATE：
使用的jqGrid refresh事件。

var rowCount = $("#gridid>tbody>tr").length; 
jQuery("#gridid").jqGrid({ 
... 
    refresh: function(){ 
     var currCount = $("#gridid>tbody>tr").length; 
     if (currCount !== rowCount) { 
      alert("Number of rows changed!"); 
      rowCount = currCount; 
     } 
    }, 
... 
});

如果手動刪除上點擊任何行，你需要有太多運行您的代碼，除非它也重裝電網。

來源

2012-03-19 19:19:51

感謝您的回覆。設置時間間隔不會爲我的情況帶來解決方案。 – 2012-03-19 19:30:00

如果你不能使用setInterval並且你想要一個跨瀏覽器的解決方案，唯一的其他選擇就是使用任何代碼來改變表的內容來觸發事件。什麼是更新表？ – 2012-03-19 20:26:08

jq網格正在更新表 – 2012-03-19 21:12:52

http://www.w3.org/TR/DOM-Level-2-Events/events.html - 你可以使用它。但在IE中暫時沒有實現或填充。

此外，您可以檢查定時器運行功能的TR計數。

來源

2012-03-19 19:08:43 SilentImp

我相信你可能正在考慮'DOMNodeInserted'，但你應該指定或直接鏈接到它在文檔中的錨點。整個DOM事件規範的上下文毫無幫助。 – 2012-03-19 19:11:51

感謝您的回覆。在發佈之前，我已經看過這個鏈接。正如我之前所說的，不使用添加/刪除行的實現。但是，行數將根據itemssource而變化。 – 2012-03-19 19:16:21

正在使用ordinar top.window.oldCount = 0; windows.setInterval（200，function（）{var count = $（「＃mytable tr」）.length; if（count！= top.window.oldCount）{top.window.oldCount = count; do_something（）;}} ）;函數do_something（）{}不是一個選項？ – SilentImp 2012-03-19 19:48:48

您可以監視DOM事件DOMSubtreeModified（注意事件已被棄用，因此，如果有人有更好的活動的建議進行監控，請改變這個），這觸發電平變化到DOM樹。我們可以使用jQuery的bind函數在表中觸發事件時觸發函數。該功能可以檢查行數是否已更改。

var numberOfRows = $("#myTable>tbody>tr").length; 
$("#myTable").bind("DOMSubtreeModified", function() { 
    if($("#myTable>tbody>tr").length !== numberOfRows){ 
     numberOfRows = $("#myTable>tbody>tr").length; 
     alert("row count changed.."); 
    } 
});

Try It!

參見：Is there a JavaScript/jQuery DOM change listener?

來源

2012-03-19 19:15:15 Adam

感謝您的回覆。是的，這帶來了解決方案。但是，即使我將元素添加到td，DOMSubtreeModified事件也是觸發器。這不是一件好事。我將使用更多行數（超過10000rows）。所以，這聽起來不合適。 – 2012-03-19 19:27:58

我這樣做，一旦與一個計時器。這不是很漂亮，但幾乎每一個瀏覽器我覺得工作在...

http://jsfiddle.net/q5Eqr/

var html; 
setInterval(function() { 
    var table = $('table'); 
    if($('table').html() != html){ 
     alert('Changed!'); 
     html = $('table').html(); 
    } 
}, 500);

來源

2012-03-19 19:17:09 Alex

監聽表格行數改變

回答

相關問題