我想從ckeditor動態獲取數據到div

Question

我創建了一個javascript，它會在div的click事件上打開ckeditor，並將數據從div獲取到ckeditor，現在我想要一些可以使更新后的數據從ckeditor重新回到該div的東西。 並且動態發生。

我正在使用此javascript從div獲取數據

//var editor, html = '';
function createEditor(ele)
{
var x = ele.innerHTML;


CKEDITOR.instances.editor1.setData(x);


 var y = document.getElementById("editor1").value;
alert(y);
//ele.innerHTML = y;
document.getElementById("editor1").style.display = "block";

}


    </script>

我的HTML是

 <div onclick="createEditor(this);" id="id2"> hello how r u? </div>

請幫我

Answer 1

所以我想您想實時預覽CKEditor嗎？ 您將無法使用事件keyup來執行此操作，但可以使用CKEditor事件（ instance.on('key', doSomething()); key （ instance.on('key', doSomething()); ））。

步驟1：在頁面中添加兩個元素：

ID為：的文本區域：編輯器
div ID：預覽

...
<body>
    <textarea id="editor"></textarea>
    <div id="preview"></div>
</body>
...

第2步：添加JavaScript以檢測key事件並更新#preview ：

CKEDITOR.replace('editor'); //new ckeditor instance
var editor = CKEDITOR.instances.editor; //reference to instance

//on `key` event
editor.on('key', function(){

  var data = editor.getData(); //reference to ckeditor data
  $('#preview').html(data); //update `div` html

});

我已經在JSBin中創建了一個預覽。

Answer 2

我認為，在您的ckeditor textarea上綁定onKeyUp事件應該可以解決問題。 http://www.w3schools.com/jsref/event_onkeyup.asp

我想從ckeditor動態獲取數據到div

問題描述

2 個解決方案

解決方案1
4 已采納 2012-11-21 13:46:40

解決方案2
1 2012-11-21 09:15:58

我想從ckeditor動態獲取數據到div

問題描述

2 個解決方案

解決方案1 4 已采納 2012-11-21 13:46:40

解決方案2 1 2012-11-21 09:15:58

解決方案1
4 已采納 2012-11-21 13:46:40

解決方案2
1 2012-11-21 09:15:58