我的任务是在当前插入位置的contentEditable div中插入一个空的span节点。
以下内容在Firefox 22.0上没有任何问题:
HTML
<div class="parent" contentEditable=true>
<div>text</div>
</div>
的Javascript
$('.parent').on("keyup", function(e){
if (e.which == 73) {
node = '<span class="new"></span>';
document.execCommand('insertHtml', null, node);
}
});
要重现:将插入符号放在“文本”一词的某个位置,然后按“i”键在当前选择中插入空跨度。
请参阅:http://jsfiddle.net/amirisnino/pZecx/2/
示例:
在单词
的中间按“i”键时预期结果:
<div class="parent" contentEditable=true>
<div>tei<span class="new"></span>xt</div>
</div>
会发生什么?
<div class="parent" contentEditable=true>
<div>teixt</div>
<span class="new"></span>
<div><br></div>
</div>
对此的任何帮助将不胜感激。提前谢谢。
答案 0 :(得分:2)
您可以将span元素的contenteditable属性设为false。为了达到您的期望,您必须移动if条件之外的最后两行。这是:
$('.parent').on("keyup", function(e){
if (e.which == 73) {
node = '<span contenteditable="false" class="new"></span>';
document.execCommand('insertHtml', null, node);
}
content = $(this).html()
$('.result').text(content)
});
答案 1 :(得分:0)
这有用吗?
$('.parent div').append(node);
而不是:
document.execCommand('insertHtml', null, node);