动态表行没有绑定

时间:2013-07-03 15:58:05

标签: javascript jquery jquery-ui

这是我用来附加表格行的代码,其中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();
                      });

我第一次得到的一切都很好..表格行已经附加正常..当我第二次执行相同的追加时,会生成表格行。只显示最后生成的行...不是以前的..为什么是这样的..这里的任何人都可以给我打电话,...我试过现场,委托方法..但没有工作......我正在使用jquery-1.9.1.js

1 个答案:

答案 0 :(得分:1)

我认为一个问题是您创建了一个具有相同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();

    }
});