Question

我在视图中有Ckeditor，我动态地获得编辑器值并在div中显示它们。我尝试了许多定义（val，html，tex等）的组合：

CKEDITOR.on('instanceCreated', function (e) {
    e.editor.on('contentDom', function () {
        e.editor.document.on('keyup', function (event) {
            var str = CKEDITOR.instances['editor1'].getData();
            $("#mirror1").text(str);
            $("#mirror2").val(str);
            $("#mirror3").html(str);
            $('#mirror4').val($('<div/>').html(str).text());
        }
      );
    });
});

我的divs

<div id="mirror1">
</div>
<div id="mirror2">
</div>
<div id="mirror3">
</div>
<div id="mirror4">
</div>

for exaple当我写<pre>int i=0;</pre>

时

mirror1 text= &lt;pre&gt;deneme&lt;/pre&gt;
mirror2 text= null
mirror3 text= <pre>int i=0;</pre>
mirror4 text= null

我期待输出：int i=0;

我怎么能这样做。什么是正确的语法？感谢。

Answer 1

如果跳过jQuery部分，可以使用简单的javascript：

CKEDITOR.on('instanceCreated', function (e) {
    e.editor.on('contentDom', function () {
        e.editor.document.on('keyup', function (event) {
            var str = CKEDITOR.instances['editor1'].getData();
            document.getElementById("mirror1").innerHTML = str;
        }
      );
    });
 });

但是如果你想要一个好的镜像，使用DOM keyup事件可能还不够，我建议你使用onChange plugin for CKEditor（免责声明：我写了它），现在只要内容发生变化，镜像就会更新： / p>

CKEDITOR.on('instanceCreated', function (e) {
    var mirror2 = document.getElementById("mirror2");
    e.editor.on('change', function () {
        mirror2.innerHTML = CKEDITOR.instances['editor1'].getData();
    });
});

将Ckeditor值传递给没有html标签的div文本？

1 个答案: