化妆未来CONTENTEDITABLE元素编辑

我有以下结构化妆未来CONTENTEDITABLE元素编辑

<div> 
<ul id='t1'> 
    <li id='l1' contenteditable='true' class='editable'> Lorem ipsum </li> 
    <li id='l2' contenteditable='true' class='editable'> Lorem ipsum </li> 
    <li id='l3' contenteditable='true' class='editable'> Lorem ipsum </li> 
</ul> 
</div>

当用户编辑说李L3，当他打进入我希望与CONTENTEDITABLE =真实，SETFOCUS上添加新的利我想在这里新的李，使用户可以开始在那里输入。我能够在输入时添加新条目，但无法将焦点放在它上面。

更新

if(e.keyCode == 13){//enter Key or tab key 9 
    e.preventDefault(); 
    var taskId = this.id; 
    jQuery.ajax({ 
     url : 'update_current', 
     type : 'put', 
     success : function(resp){ //resp is the new li tag 
      var li = this_is_current_elemtn; 
      jQuery(li).append(resp); 

      //$('#t1 .editable').each(function(){ 
      // $(this).attr('editable', 'false'); 
      //}); 
      console.log(jQuery(li).next()); 

      jQuery(li).next().focus(); 
     // $('#t1 .editable').each(function(){ 
     // $(this).attr('contentEditable', 'true'); 
     // }); 
     } 
    });

任何帮助表示赞赏

来源

2012-11-06 Ross

你尝试过什么吗？ – Johan

如果你已经创建了元素，那么你可以使用$（“＃younewelement”）。 –

用焦点和选择尝试，但仍然当前contenteditable保持焦点，不转移焦点到新添加的元素 – Ross

试试这个：http://jsfiddle.net/t7GJc/

$('#t1').on('keydown', 'li', function(e){ 
    var c = e.which || e.keyCode; 
    if(c === 13){ 
     e.preventDefault();      
     if($(this).is($('#t1 li:last'))){ 
      $(this).after($('<li id="l'+($('#t1 li').length + 1)+'" contenteditable="true"/>')); 
     } 
     $(this).next().focus(); 
    } 
});

来源

2012-11-06 15:53:00

添加我的js代码...有些什么相同 – Ross

@Ross它不工作就像你想要在jsfiddle演示？如果不是为什么？ –

哦，是的，它会......尝试这段代码，谢谢@adam – Ross

jsfiddle

$("ul").on("keyup", "li",function(e){ 
    if(e.keyCode == 13){ 
    var elem = $("<li contenteditable='true'> Lorem ipsum </li>").appendTo ($(this).parent()); 
     elem.focus(); 
} 
     return false; 

    });

来源

2012-11-06 15:59:12 Anoop

谢谢，也会试试这个 – Ross

我知道这有点晚了，但无论如何，如果您将contenteditable ='true'添加到父ol或ul中，它就可以实现！ :)

来源

2013-11-28 15:02:29 gslezynger

化妆未来CONTENTEDITABLE元素编辑

回答

相关问题