Question

生成动态元素的代码：

$(".add_entry").click(function(event) {
    id=event.target.id;
    var parent_id=($("#"+id+"").parent().get(0).id);
    var i=$("#"+parent_id+"_add").children().children().length;
    i=i+1;
    var content='<li id="'+parent_id+'_'+i+'"><div class="timelineUnit"><h4 class="click"        style="float:left;">Manager</h4><h4 style="float:right;"><span class="timelineDate   click">2010 - Present</span></h4><h5 class="click" style="clear:both;">Ligula Non Lectus</h5><p class="autogrow">Lorem ipsum dolor sit amet, consectetur adipiscingVivamus sit amet ligula non lectus cursus egestas. Cras erat lorem, fringilla quis sagittis in, sagittis inNam leo tortor Nam leo tortor Vivamus.</p></div></li>';
    $("#"+parent_id+"_add").append(content);
});

和可编辑的功能代码

$(function() {
    $(".click").editable("<?php echo HTTP_URL; ?>inline/php/assign.php", { 
        indicator : "<img src='<?php echo HTTP_URL; ?>inline/img/indicator.gif'>",
        tooltip   : "Click to edit...",
        style  : "inherit",
        submit    : 'Ok',
        cancel    : 'Cancel',
    });
});

以上代码适用于html之类的 <span class="click" id="name2">test</span> 但不适用于动态生成的html表单jquery（上面的函数）。

Answer 1

绝不是一个javascript人，但有时会修补。

但如果你在DOM中注入html，你不需要用.live或.on编写它吗？

Answer 2

对于动态生成的元素，还必须在生成脚本中调用可编辑脚本。

替换您的代码：

    $(".add_entry").click(function(event) {
     id=event.target.id;
     var parent_id=($("#"+id+"").parent().get(0).id);
     var i=$("#"+parent_id+"_add").children().children().length;
     i=i+1;
     var content='<li id="'+parent_id+'_'+i+'"><div class="timelineUnit"><h4   class="click"        style="float:left;">Manager</h4><h4 style="float:right;"><span class="timelineDate   click">2010 - Present</span></h4><h5 class="click" style="clear:both;">Ligula Non Lectus</h5><p class="autogrow">Lorem ipsum dolor sit amet, consectetur adipiscingVivamus sit amet ligula non lectus cursus egestas. Cras erat lorem, fringilla quis sagittis in, sagittis inNam leo tortor Nam leo tortor Vivamus.</p></div></li>';
      $("#"+parent_id+"_add").append(content);


      $(".click").editable("<?php echo HTTP_URL; ?>inline/php/assign.php", { 
       indicator : "<img src='<?php echo HTTP_URL; ?>inline/img/indicator.gif'>",
       tooltip   : "Click to edit...",
       style  : "inherit",
       submit    : 'Ok',
       cancel    : 'Cancel',
      });



    });

jeditable（内联编辑器）不适用于动态生成的元素

2 个答案: