Ck editor is not working after putting it in innerHTML to replace a div with the Ckeditor textarea

问题

today i have been assigned a work where i have an input text and if someone will click on it then it will replace it with a textaread which has ckeditor enabled on it. I already enabled the ckeditor with the textarea but when i am going trying to replace a div with the ckeditor enabled textarea then it is just showing me a simple textarea not with ckeditor enabled on it.Below is the coding for it:-

<script type="text/javascript">
function myJDFunction1()
{
document.getElementById("Hide1").innerHTML='<textarea class="ckeditor" id="typingarea2" name="typingarea2"></textarea>';
}

</script>



<div id="Hide1">
    <textarea name="Answer1" onclick="myJDFunction1()"></textarea>
</div>

回答1:

You have to call

CKEDITOR.replace( 'typingarea2' );

since editor instances are created automatically (by class) only when the page is being loaded.

Also a better way is:

function myJDFunction1() {
    CKEDITOR.appendTo( 'Hide1' );
}

<div id="Hide1" onclick="myJDFunction1()">&nbsp;</div>

回答2:

Try using jquery plugin adater to call CKEDITOR Jquery Plugin for CKEDITOR

1. import jquery javascript files.
2. import jquery ckeditor adapter "/ckeditor/adapters/jquery.js".

3. bind your CKEDITOR to the DOM Element.

    $('#Hide1').ckeditor();
   

回答3:

<a href="#" id="Hide1" onclick='document.getElementById("Hide1").innerHTML=
"<textarea class=ckeditor id=typingarea2 name=typingarea2></textarea>"'>text editor</a>

来源：https://stackoverflow.com/questions/15382622/ck-editor-is-not-working-after-putting-it-in-innerhtml-to-replace-a-div-with-the