通过CKEDITOR价值div的文本不包含HTML标签？ [英] pass Ckeditor value to div text without html tags?

问题描述

我有CKEDITOR在我看来，我得动态地编辑值，并显示在div的。我试图定义是这样的（VAL，HTML，纺织等）的许多combinaiton：

I have Ckeditor in my view and I dynamicly get editor value and show them in divs. I tried many combinaiton of defining(val,html,tex, etc) like this:

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());
        }
      );
    });
});

我的div

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

有关的exaple当我写＆LT; pre＆GT; INT I = 0;＆LT; / pre＆GT;

for exaple When I wrote <pre>int i=0;</pre>

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

我米期待输出： INT I = 0;

我怎么可能会做this.What是正确的语法？谢谢你。

How may I do this.What is the correct syntax?. Thanks.

推荐答案

如果你跳过了jQuery的一部分，你可以用简单的JavaScript做到这一点：

If you skip the jQuery part, you can do it with simple 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插件的CKEditor （声明：我写的），现在照镜子会随时更新内容的变化：

But using the DOM keyup event might not be enough if you want a good mirror, I suggest you to use the onChange plugin for CKEditor (disclaimer: I wrote it) and now the mirror will update whenever the content changes:

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

这篇关于通过CKEDITOR价值div的文本不包含HTML标签？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！