admin管理员组

文章数量:1315252

I have created a javascript which opens ckeditor on click event of div, and gets the data from the div to ckeditor, now i want something what can get that updated data from ckeditor back to that div again. and which happens dynamically.

I am using this javascript to get data from 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>

And my HTML is

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

Please help me on this

I have created a javascript which opens ckeditor on click event of div, and gets the data from the div to ckeditor, now i want something what can get that updated data from ckeditor back to that div again. and which happens dynamically.

I am using this javascript to get data from 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>

And my HTML is

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

Please help me on this

Share Improve this question edited Nov 21, 2012 at 9:35 Nishant Solanki asked Nov 21, 2012 at 9:13 Nishant SolankiNishant Solanki 2,1283 gold badges19 silver badges32 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 4

So I guess you want a live preview for CKEditor? You'll not be able to do this with the event keyup, but you can use CKEditor events like key (instance.on('key', doSomething());).

Step 1: Add two elements to the page:

  1. textarea with ID: editor
  2. div with ID: preview

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

Step 2: Add javascript to detect key events and update #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

});

I've created a preview in JSBin.

I think, that binding onKeyUp event on your ckeditor textarea, should do the trick. http://www.w3schools./jsref/event_onkeyup.asp

本文标签: javascriptI want to get data from ckeditor dynamically to the divStack Overflow