动态表行未绑定

Dynamic Table row not binding

本文关键字:绑定 动态      更新时间:2023-09-26

这是我用来附加表行的代码,其中personTabs是iframe名称

$(".addClass1").on('click',function() {
           parent.parent.parent.personTabs.$("#skilltableId").append(                        
                  '<tr id="skilltableId1"><td class="btnRemoving">'+$("#selecetedValue").val()+'</td><td class="editing">'+$("#type").val()+'</td><td style="display:none">'+$("#commonDbid").val()+'</td></tr><br>'                    
        );  

当我单击td class='editing'时,我将生成一个文本框,如下所示。。

 parent.parent.parent.personTabs.$(".editing").on('click',function() {
                    var data = $(this).text();
                     $(this).html("<input type='text' id='focus123' value='"+data+"'/>").children().focus();
                      });

我第一次一切都好起来了。。表中的行被添加得很好。。当我第二次执行相同的追加操作时,将生成表行。onclick仅适用于最后生成的行。。但不是前一个。。为什么这么…这里的任何人都可以告诉我,。。我尝试了现场委托的方法。。但都没用。。我使用的是jquery-1.9.1.js

我认为一个问题是您创建了一个具有相同id的文本框。我不知道你为什么用parent.parent.parent…

 $(".addClass1").on('click',function() {
           $("#skilltableId").append(                        
                  '<tr id="skilltableId1"><td class="btnRemoving">'+$("#selecetedValue").val()+'</td><td class="editing">'+$("#type").val()+'</td><td style="display:none">'+$("#commonDbid").val()+'</td></tr><br>'                    
        ); 
$(".editing").on('click',function() {
                var data = $(this).text();
                 $(this).html("<input type='text' class='focus123' value='"+data+"'/>").children().focus();
                  });

我不确定它是否有效,但你也可以使用这个javascript函数

$(".addClass1").on('click', function () {
    $("#skilltableId").append('<tr id="skilltableId1"><td class="btnRemoving">' + $("#selecetedValue").val() + '</td><td class="editing" on click="myfunction(this)">' + $("#type").val() + '</td><td style="display:none">' + $("#commonDbid").val() + '</td></tr><br>');
    function myfunction(selectedTd) {
        var data = $(selectedTd).text();
        $(selectedTd).html("<input type='text' class='focus123' value='" + data + "'/>").children().focus();
    }
});