Cannot convert dynamically loaded teaxtarea into ckeditor

问题

calling this get_content function after clicking a link.

function get_content(n)
{
    var hr=new XMLHttpRequest();
    var url="./updatecontent.php";
    var vars="id="+n;
    hr.open("POST",url,true);
    hr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    hr.onreadystatechange=function()
    {
        if(hr.readyState==4 && hr.status==200)
        {
            var return_data=hr.responseText;
            document.getElementById("content").innerHTML=return_data;
        }
    }
    hr.send(vars);
    document.getElementById("content").innerHTML='<img src="./img/loading.gif">';
}

<div id="content"></div>

The following is the response data

<div id="text-editor" style="width:100%;">
<form action="" method="post">
<textarea class="ckeditor" name="editor1" id="txt1"></textarea>
<input type="submit" name="update" value="Update">
</form>
</div>
<script  src="./ckeditor/ckeditor.js"></script>

The response data is succefully added to div id="content"

The relative link to ckeditor is correct.But the textarea is not converting into CKeditor. where is the mistake? please help.

回答1:

In this case you need to call CKEDITOR.replace('editor1') after content being changed.

So in your case it will be

function get_content(n)
{
    var hr=new XMLHttpRequest();
    var url="./updatecontent.php";
    var vars="id="+n;
    hr.open("POST",url,true);
    hr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    hr.onreadystatechange=function()
    {
        if(hr.readyState==4 && hr.status==200)
        {
            var return_data=hr.responseText;
            document.getElementById("content").innerHTML=return_data;
            CKEDITOR.replace('editor1'); // <-- add this line
        }
    }
    hr.send(vars);
    document.getElementById("content").innerHTML='<img src="./img/loading.gif">';
}

来源：https://stackoverflow.com/questions/19988754/cannot-convert-dynamically-loaded-teaxtarea-into-ckeditor

标签

javascript

html

ajax

ckeditor