2

我有以下结构

<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>

我在这里想要的是当用户编辑说 li l3 并且当他按 Enter 键时，我想添加新的 li，其中 contenteditable = true 并在新的 li 上设置焦点，以便用户可以开始在那里输入。我能够在输入时添加一个新条目，但无法将焦点放在它上面。

更新

 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');
         // });
        }
    });

任何帮助表示赞赏

4

3 回答 3

2

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

于 2013-11-28T15:02:29.363 回答
0

试试这个：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-06T15:53:00.980 回答
0

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-06T15:59:12.410 回答