如何在TABLE中检测动态生成的ROWS

Question

我有一个表，它的行是动态创建的 我想在生成tr或td时提示消息[alert]。

起初它就像

<table class="tab"></table>

之后将动态添加行。

<table class="tab">
 <tr class="row">
  <td> Message1</td>
  <td> Message2</td>
 <tr>
</table>

Table和TR的类名将始终相同，但TD中的消息将发生变化 我想在添加TD时在ALERT中显示消息。

修改
它接缝我的问题不明确。 我试图从以下链接实现这个JSF的东西 CLICK HERE

它是一个文件上传的东西，当你上传错误的文件然后它会在表行中抛出一条错误消息，我想在消息发生时提醒它。

  

ANSWER
  大家好，感谢大家的回答。我得到了答案。

$(document).bind('DOMNodeInserted', function(e) {
    var element = e.target;
    if($(element).is("tr.tab")) {
    alert("New ROW ADDED");
    }           
});

Answer 1

看一下DOM Events

https://en.wikipedia.org/wiki/DOM_events

“DOMNodeInserted - 将节点添加为另一个节点的子节点时触发”

---

如果失败，您可以使用超时轮询DOM，并为已经处理的所有内容添加一个类

setatimeout...
function timeouthandler (
  var newitems = $.(".tab td").not('.processed');
  if newitems {
     alert('new stuff!');
     newitems.addClass('processed')
  }
  setanothertimeout...
)

这是我的头脑，需要一些工作。随意用实际有用的东西编辑这个答案; - ）

Answer 2

您可以使用 setinterval 并以这样的方式编写函数：如果更改了表的html。然后找到附加的td并为用户提醒消息。

var previous_tr_html='';
setInterval(function() { $checkError(); }, 1000);

function checkError(){
  var current_tr_html=$('.row').html();
  if(previous_tr_html!=current_tr_html){
//new td added
  newerrortds=$('.row').find('td:not(.displayed)');
  $(newerrortds).each(function(){
  alert($(this).html();)
//add already displayed error class to current td
  $(this).addClass('displayed');
});
//change previous html value to current
 previous_tr_html=current_tr_html;
}

}

Answer 3

我建议您根据此讨论找到解决方案：How to detect new element creation in jQuery?

$(document).ready(function(){
    $(document).bind('DOMSubtreeModified',function(){
        $('.template-upload.ui-state-error').each(function( index ){
            alert( "The file '"+$(this).find('.name').html()+" is not valid" );
            $(this).find('.ui-icon-cancel').click();
        });
    })
});

不幸的是，我不是一个jquery专家，所以检查我的代码并进行实验。如果您需要更多帮助，请告诉我。

Answer 4

扩展上传器脚本以通过事件回调自行报告 - 这是我的最佳方式。

Answer 5

我认为使用jqueries .on() event

可以简化解决方案

使用此选项可以在一个语句中指定事件和选择器：

$(document).on( "DOMNodeInserted", "tr.row", function() {
  alert( "New ROW ADDED" );
});

这是working JSFiddle