标签: inserthtml

我的任务是在当前插入位置的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);
   }
});

要重现:将插入符号放在单词"text"的某个位置,然后按"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>

任何有关这方面的帮助将不胜感激.先感谢您.

我很难成功地将要拖放的html元素放入Ckeditor中。到目前为止，我刚刚能够使用“ setData”将其放置在内容的末尾。但我想将其放置在光标所在的位置。

我的意思是，而不是这样做：

<p>My content with <span>spans</span>, <a>links</a>, etc.</p><span>The html I am drag/droping</span>

我想做这个 ：

<p>My content with <span>spans</span>, <span>The html I am drag/droping</span>, <a>links</a>, etc.</p>

现在，我的代码如下所示：

CKEDITOR.instances['myContent'].insertHtml(' <span>The html I am drag/droping</span>');

我已经尝试过insertText，但从未成功。然后，我尝试了insertHtml，但它仅在IE o_O中有效。

您对如何解决有任何想法吗？那将是很大的帮助！谢谢。