移动光标，指向下一个contentEditable - jQuery

我期待做的具体是当我按下输入它创建一个新的段落光标然后移动到或选择新的内容可编辑段落开始键入，但我似乎无法找到一种方式去做吧。移动光标，指向下一个contentEditable - jQuery

/*HTML Layout*/ 
<div id="wrap" contenteditable="true"> 
|| <----cursor posiiton 
//*New paragraph content editable when enter is pressed 
<p contenteditable="true">New Paragrpah</p> 
</div> 

/* JQuery Code */ 
if(event.which == 13){ 
event.preventDefault(); 
elem.append('<p>insert a new paragraph</p>'); 
$('#container *').attr('contenteditable','true'); 
$('p', elem).focus();}

任何人都有什么见解？将不胜感激。

我知道它可能与输入字段和.focus（）但它不会工作在一个contentEditable必须有一种方法来做到这一点。

问候帕特里克

来源

2011-06-04 Patrick Hendron

请提供完整的代码接下来的时间，即事件处理程序一样好，甚至只给一份直接的jsfiddle什么的，所以我们可以直接尝试进行这项工作。为什么你想在contenteditable项目中有一个'contenteditable'项目呢？ – Niklas 2011-06-04 13:16:02

我会把它放在Jsfiddle上。我这样做是为了点击一个空白空间上可编辑的内容，但我想添加一个点击事件到一个空白空间来添加一个新的内容编辑将工作是一样的。 – 2011-06-04 13:21:30

禁用父contenteditable，将焦点设置新contenteditable，使家长contenteditable和背部集中在母公司contenteditable（不会让你到外面的当前，否则在某些浏览器移动。）。

$(window).keydown(function(event){ 

if(event.which == 13){ 

    event.preventDefault(); 

    var p = $('<p />').text("insert a new paragraph").attr('contenteditable','true').appendTo($('#wrap')); 
    $('#wrap').attr('contenteditable','false'); 
    $(p).focus(); 
    $('#wrap').attr('contenteditable','true').focus(); 

} 

});

例子：http://jsfiddle.net/niklasvh/6AsHq/

来源

2011-06-04 13:57:13 Niklas

Nikklas版本的作品！我也为自己工作：http://jsfiddle.net/patrickhendron/2WGen/1/ – 2011-06-04 14:01:19

很高兴你找到了解决方案。 'contenteditable'当然不像我预料的那样工作。 – Niklas 2011-06-04 14:04:28

移动光标，指向下一个contentEditable - jQuery

回答

相关问题