Phiên bản CKEditor đã tồn tại

Tôi đang sử dụng hộp thoại jquery để trình bày biểu mẫu (được tìm nạp qua AJAX). Trên một số biểu mẫu, tôi đang sử dụng CKEditor cho các textareas. Trình chỉnh sửa hiển thị tốt trong lần tải đầu tiên.

Khi người dùng hủy hộp thoại, tôi sẽ xóa nội dung để chúng được tải mới theo yêu cầu sau này. Vấn đề là, khi hộp thoại được tải lại, CKEditor tuyên bố rằng trình chỉnh sửa đã tồn tại.

uncaught exception: [CKEDITOR.editor] The instance "textarea_name" already exists.

API bao gồm một phương pháp để hủy các trình chỉnh sửa hiện có và tôi đã thấy mọi người khẳng định đây là một giải pháp:

if (CKEDITOR.instances['textarea_name']) {
CKEDITOR.instances['textarea_name'].destroy();
}
CKEDITOR.replace('textarea_name');

Điều này không hiệu quả với tôi, vì tôi nhận được một lỗi mới thay thế:

TypeError: Result of expression 'i.contentWindow' [null] is not an object.

Lỗi này dường như xảy ra trên "tiêu diệt ()" thay vì "thay thế ()". Có ai đã trải qua điều này và tìm thấy một giải pháp khác nhau?

Có thể 'hiển thị lại' trình chỉnh sửa hiện có, thay vì phá hủy và thay thế nó không?

CẬP NHẬT Đây là một câu hỏi khác giải quyết vấn đề tương tự, nhưng anh ấy đã cung cấp một trường hợp thử nghiệm có thể tải xuống .

Để điều này hoạt động, bạn cần phải truyền tham số boolean true khi hủy thể hiện:

    var editor = CKEDITOR.instances[name];
    if (editor) { editor.destroy(true); }
    CKEDITOR.replace(name);

function loadEditor(id)
{
    var instance = CKEDITOR.instances[id];
    if(instance)
    {
        CKEDITOR.remove(instance);
    }
    CKEDITOR.replace(id);
}

Tôi cũng gặp sự cố này, nhưng tôi đã giải quyết nó theo cách đơn giản hơn nhiều ...

Tôi đang sử dụng lớp "ckeditor" trong tập lệnh jQuery của mình làm bộ chọn cho các vùng văn bản mà tôi muốn sử dụng cho CKEditor. Tập lệnh ckeditor JS mặc định cũng sử dụng lớp này để xác định các textareas nào sẽ sử dụng cho CKEditor.

Điều này có nghĩa là có xung đột giữa tập lệnh jQuery của tôi và tập lệnh ckeditor mặc định.

Tôi chỉ đơn giản là đã thay đổi lớp của textarea và tập lệnh jQuery của tôi thành 'do_ckeditor' (bạn có thể sử dụng bất cứ thứ gì ngoại trừ "ckeditor") và nó đã hoạt động.

Đây là giải pháp đơn giản nhất (và duy nhất) phù hợp với tôi:

if(CKEDITOR.instances[editorName])
   delete CKEDITOR.instances[editorName];
CKEDITOR.replace(editorName);

Xóa mục nhập này trong mảng ngăn kiểm tra an toàn biểu mẫu này hủy ứng dụng của bạn.

hủy () và loại bỏ () không hoạt động đối với tôi.

Có lẽ điều này sẽ giúp bạn - Tôi đã làm điều gì đó tương tự bằng cách sử dụng jquery, ngoại trừ việc tôi đang tải lên một số lượng đối tượng ckeditor không xác định. Tôi đã mất một lúc để tình cờ hiểu được điều này - nó không rõ ràng trong tài liệu.

function loadEditors() {
    var $editors = $("textarea.ckeditor");
    if ($editors.length) {
        $editors.each(function() {
            var editorID = $(this).attr("id");
            var instance = CKEDITOR.instances[editorID];
            if (instance) { instance.destroy(true); }
            CKEDITOR.replace(editorID);
        });
    }
}

Và đây là những gì tôi chạy để lấy nội dung từ các biên tập viên:

    var $editors = $("textarea.ckeditor");
    if ($editors.length) {
        $editors.each(function() {
            var instance = CKEDITOR.instances[$(this).attr("id")];
            if (instance) { $(this).val(instance.getData()); }
        });
    }

CẬP NHẬT : Tôi đã thay đổi câu trả lời của mình để sử dụng phương pháp chính xác - đó là .destroy (). .remove () có nghĩa là nội bộ và được ghi lại không đúng cách tại một thời điểm.

Tôi đã gặp vấn đề tương tự khi chúng tôi tạo một số phiên bản CKeditor cho nội dung được tải qua ajax.

CKEDITOR.remove ()

Giữ DOM trong bộ nhớ và không xóa tất cả các ràng buộc.

CKEDITOR.instance [instance_id] .destroy ()

Đã nhận lỗi i.contentWindow error bất cứ khi nào tôi tạo phiên bản mới với dữ liệu mới từ ajax. Nhưng điều này chỉ xảy ra cho đến khi tôi phát hiện ra rằng tôi đang phá hủy phiên bản sau khi xóa DOM.

Sử dụng hủy () trong khi phiên bản và DOM của nó hiện diện trên trang, sau đó nó hoạt động hoàn toàn tốt.

Đối với các yêu cầu ajax,

 for(k in CKEDITOR.instances){
    var instance = CKEDITOR.instances[k];
    instance.destroy()
 }
  CKEDITOR.replaceAll();

đoạn này sẽ xóa tất cả các phiên bản khỏi tài liệu. Sau đó, tạo các phiên bản mới.

var e= CKEDITOR.instances['sample'];
e.destroy();
e= null;

Các i.contentWindow is nulllỗi dường như xảy ra khi gọi phá hủy trên một thể hiện trình soạn thảo mà bị trói vào một textarea không còn trong DOM.

CKEDITORY.destroynhận một tham số noUpdate.

APIdoc cho biết:

Nếu cá thể đang thay thế một phần tử DOM, tham số này cho biết có cập nhật phần tử với nội dung cá thể hay không.

Vì vậy, để tránh lỗi, hãy gọi hủy trước khi xóa phần tử textarea khỏi DOM hoặc gọi hàm đích (true) để tránh cố gắng cập nhật phần tử DOM không tồn tại.

if (CKEDITOR.instances['textarea_name']) {
   CKEDITOR.instances['textarea_name'].destroy(true);
}

(sử dụng phiên bản 3.6.2 với bộ điều hợp jQuery)

Đây là những gì làm việc cho tôi:

for(name in CKEDITOR.instances)
{
  CKEDITOR.instances[name].destroy()
}

CKEDITOR.instances = new Array();

Tôi đang sử dụng cái này trước khi gọi để tạo một phiên bản (những cái mỗi lần tải trang). Không chắc chắn điều này ảnh hưởng như thế nào đến việc xử lý bộ nhớ và những gì không. Điều này sẽ chỉ hoạt động nếu bạn muốn thay thế tất cả các phiên bản trên một trang.

Tôi đã chuẩn bị giải pháp của riêng mình dựa trên tất cả các mã trên.

      $("textarea.ckeditor")
      .each(function () {

                var editorId = $(this).attr("id");

                try {    
                    var instance = CKEDITOR.instances[editorId];
                    if (instance) { instance.destroy(true); }

                }
                catch(e) {}
                finally {
                    CKEDITOR.replace(editorId);
                }
            });

Nó hoạt động hoàn hảo cho tôi.

Đôi khi sau khi yêu cầu AJAX có cấu trúc DOM sai. Đối với instace:

<div id="result">
   <div id="result>
   //CONTENT
   </div>
</div>

Điều này cũng sẽ gây ra sự cố và ckEditor sẽ không hoạt động. Vì vậy, hãy đảm bảo rằng bạn có cấu trúc DOM chính xác.

tôi đã gặp vấn đề tương tự với các phiên bản, tôi đã tìm khắp mọi nơi và cuối cùng việc triển khai này hoạt động với tôi:

    //set my instance id on a variable

    myinstance = CKEDITOR.instances['info'];

    //check if my instance already exist

    if (myinstance) { 
        CKEDITOR.remove(info)
    }

    //call ckeditor again

    $('#info').ckeditor({
        toolbar: 'Basic',
        entities: false,
        basicEntities: false
    });

Bạn có thể xóa bất kỳ phiên bản ckeditor nào bằng phương thức remove ckeditor. Phiên bản sẽ là id hoặc tên của vùng văn bản.

if (CKEDITOR.instances[instance_name]) {
    CKEDITOR.remove(CKEDITOR.instances[instance_name]);
}

Thật vậy, việc xóa lớp ".ckeditor" khỏi mã của bạn sẽ giải quyết được vấn đề. Hầu hết chúng ta đã làm theo ví dụ tích hợp jQuery từ tài liệu của ckeditor:

$('.jquery_ckeditor')
.ckeditor( function() { /* callback code */ }, { skin : 'office2003' } );

và nghĩ "... có lẽ tôi có thể thoát khỏi hoặc phần '.jquery_'".

Tôi đã lãng phí thời gian của mình để điều chỉnh chức năng gọi lại (vì {skin: 'office2003'} thực sự hoạt động), trong khi vấn đề đến từ nơi khác.

Tôi nghĩ rằng tài liệu nên đề cập rằng việc sử dụng "ckeditor" làm tên lớp không được khuyến khích, vì nó là một từ khóa dành riêng.

Chúc mừng.

Tôi đã học được điều đó

xóa CKEDITOR.instances [editorName];

của chính nó, thực sự đã loại bỏ phiên bản. TẤT CẢ các phương pháp khác mà tôi đã đọc và thấy, bao gồm cả những gì được tìm thấy ở đây tại stackoverflow từ người dùng của nó, không hoạt động với tôi.

Trong tình huống của tôi, tôi đang sử dụng lệnh gọi ajax để kéo một bản sao của nội dung được bao quanh bởi và 's. Sự cố xảy ra là do tôi đang sử dụng sự kiện jQuery .live để liên kết liên kết "Chỉnh sửa tài liệu này" và sau đó áp dụng phiên bản ckeditor sau khi tải ajax thành công. Điều này có nghĩa là khi tôi nhấp vào một liên kết khác liên kết với một sự kiện .live khác, tôi phải sử dụng xóa CKEDITOR.instances [editorName] như một phần của nhiệm vụ xóa cửa sổ nội dung (giữ biểu mẫu), sau đó tìm nạp lại nội dung được giữ trong cơ sở dữ liệu hoặc tài nguyên khác.

Tôi gặp vấn đề tương tự với Hộp thoại jQuery.

Tại sao lại hủy phiên bản nếu bạn chỉ muốn xóa dữ liệu trước đó?

function clearEditor(id)
{
  var instance = CKEDITOR.instances[id];
  if(instance)
  {
    instance.setData( '' );
  }
}

Tôi đã chọn đổi tên tất cả các phiên bản thay vì hủy / thay thế - vì đôi khi phiên bản được tải AJAX không thực sự thay thế phiên bản trên lõi của trang ... giữ nhiều RAM hơn, nhưng ít xung đột hơn theo cách này.

    if (CKEDITOR && CKEDITOR.instances) {
        for (var oldName in CKEDITOR.instances) {
            var newName = "ajax"+oldName;
            CKEDITOR.instances[newName] = CKEDITOR.instances[oldName];
            CKEDITOR.instances[newName].name = newName;
            delete CKEDITOR.instances[oldName];
        }
    }

Tôi đang ở trong tình huống phải điều khiển các hộp thoại sinh ra đó, mỗi hộp thoại trong số chúng cần có một trình mã hóa được nhúng bên trong các hộp thoại này. Và nó chỉ xảy ra như vậy các vùng văn bản chia sẻ cùng một id. (thông thường điều này rất tệ, nhưng tôi có 2 jqGrids, một trong các mục được chỉ định và một mục khác của các mục chưa được chỉ định.) Chúng chia sẻ cấu hình gần như giống hệt nhau. Vì vậy, tôi đang sử dụng mã chung để định cấu hình cả hai.

Vì vậy, khi tôi tải một hộp thoại, để thêm hàng hoặc chỉnh sửa chúng, từ jqGrid; Tôi phải xóa tất cả các phiên bản của CKEDITOR trong tất cả các textareas.

$('textarea').each(function()
{
    try 
    {
        if(CKEDITOR.instances[$(this)[0].id] != null)
        {
            CKEDITOR.instances[$(this)[0].id].destroy();
        }
    }
    catch(e)
    {

    }
});

Điều này sẽ lặp lại trên tất cả các vùng văn bản và nếu có một thể hiện CKEDITOR, thì hãy hủy nó.

Ngoài ra, nếu bạn sử dụng jQuery thuần túy:

$('textarea').each(function()
{
    try 
    {
        $(this).ckeditorGet().destroy();
    }
    catch(e)
    {

    }
});

loại bỏ class="ckeditor", nó có thể đã kích hoạt khởi tạo ckeditor

Tôi đã gặp vấn đề tương tự khi tôi nhận được ngoại lệ tham chiếu null và từ "null" sẽ được hiển thị trong trình chỉnh sửa. Tôi đã thử một số giải pháp, bao gồm nâng cấp trình chỉnh sửa lên 3.4.1 nhưng không có kết quả.

Cuối cùng tôi phải chỉnh sửa nguồn. Ở khoảng dòng 416 đến 426 trong _source \ plugins \ wysiwygarea \ plugin.js, có một đoạn mã như sau:

iframe = CKEDITOR.dom.element.createFromHtml( '&lt;iframe' + ... + '></iframe>' );

Trong FF ít nhất, iframe không được khởi tạo hoàn toàn vào thời điểm cần thiết. Tôi bao quanh phần còn lại của hàm sau dòng đó bằng hàm setTimeout:

iframe = CKEDITOR.dom.element.createFromHtml( '<iframe' + ... + '></iframe>' );
setTimeout(function()
{ 
    // Running inside of Firefox chrome the load event doesn't bubble like in a normal page (#5689)
    ...
}, 1000);

};

// The script that launches the bootstrap logic on 'domReady', so the document
...

Bây giờ văn bản hiển thị nhất quán trong hộp thoại phương thức.

Để hỗ trợ tải động (Ajax) các biểu mẫu (không có các lần làm mới trang giữa) có chứa các textareas có cùng một (gọi lại cùng một biểu mẫu) hoặc ID khác (biểu mẫu đã tải trước đó) và chuyển đổi chúng thành các phần tử CKEditor, tôi đã làm như sau (sử dụng JQuery bộ chuyển đổi):

Sau khi trang kết thúc mọi lệnh gọi Ajax cung cấp một vùng văn bản cần được chuyển đổi, tôi thực hiện lệnh gọi hàm sau:

setupCKeditor()

Điều này trông giống như thế này (nó giả định rằng các textareas của bạn được chuyển đổi thành RTE's have class = "yourCKClass" ):

    /* Turns textAreas into TinyMCE Rich Text Editors where
 * class: tinymce applied to textarea.
 */
function setupCKeditor(){

    // define editor configuration      
    var config = {skin : 'kama'};

    // Remove and recreate any existing CKEditor instances
    var count = 0;
    if (CKEDITOR.instances !== 'undefined') {
        for(var i in CKEDITOR.instances) {

            var oEditor   = CKEDITOR.instances[i];
            var editorName = oEditor.name;

             // Get the editor data.
            var data = $('#'+editorName).val();

            // Check if current instance in loop is the same as the textarea on current page
            if ($('textarea.yourCKClass').attr('id') == editorName) {
                if(CKEDITOR.instances[editorName]) {

                    // delete and recreate the editor
                    delete CKEDITOR.instances[editorName];
                    $('#'+editorName).ckeditor(function() { },config);
                    count++;

                }
            }   


        }
    }

    // If no editor's exist in the DOM, create any that are needed.             
    if (count == 0){

        $('textarea.yourCKClass').each( function(index) {

                var editorName = $(this).attr('id');
                $('#'+editorName).ckeditor(function() { $('#'+editorName).val(data); },config);

            });

    }


}

Tôi nên đề cập đến dòng:

$('#'+editorName).ckeditor(function() { $('#'+editorName).val(data); },config);

có thể (và nên) đơn giản là:

$('#'+editorName).ckeditor(function() { },config);

tuy nhiên, tôi thấy rằng trình soạn thảo thường sẽ hiển thị nội dung chính xác trong một giây sau khi tải và họ làm trống trình soạn thảo của nội dung mong muốn. Vì vậy, dòng có mã gọi lại đó buộc nội dung CKEditor phải giống với nội dung văn bản gốc. Gây ra hiện tượng chập chờn khi sử dụng. Nếu bạn có thể tránh sử dụng nó, hãy làm như vậy ..

Tôi đã gặp chính xác vấn đề giống như jackboberg. Tôi đang sử dụng tính năng tải biểu mẫu động vào các hộp thoại jquery sau đó đính kèm các tiện ích con khác nhau (bộ chọn ngày, bộ lưu trữ, v.v.). Và tôi đã thử tất cả các giải pháp được lưu ý ở trên, không có giải pháp nào trong số chúng hiệu quả với tôi.

Vì lý do nào đó, ckeditor chỉ đính kèm vào lần đầu tiên tôi tải biểu mẫu, lần thứ hai tôi nhận được chính xác thông báo lỗi giống như jackboberg.

Tôi đã phân tích mã của mình và phát hiện ra rằng nếu bạn đính kèm ckeditor trong "giữa không trung" trong khi nội dung biểu mẫu vẫn chưa được đặt vào hộp thoại, thì ckeditor sẽ không đính kèm các ràng buộc của nó một cách chính xác. Đó là vì ckeditor được đính kèm trong "giữa không trung", lần thứ hai bạn đính kèm nó ở "giữa không trung" ... poof ... một lỗi sẽ xảy ra do phiên bản đầu tiên không được xóa đúng cách khỏi DOM.

Đây là mã của tôi đã giải quyết lỗi:

var $content = $(r.content); // jQuery can create DOM nodes from html text gotten from <xhr response> - so called "mid-air" DOM creation
$('.rte-field',$content).ckeditor(function(){});
$content.dialog();

Đây là bản sửa lỗi đã hoạt động:

var $content = $(r.content).dialog(); // first create dialog
$('.rte-field',$content).ckeditor(function(){}); // then attach ckeditor widget

Tôi đã gặp phải điều này chính xác và vấn đề là plugin wordcount mất quá nhiều thời gian để khởi tạo. Hơn 30 giây. Người dùng sẽ nhấp vào chế độ xem hiển thị ckeditor, sau đó hủy, do đó tải một trang mới vào dom. Plugin đã phàn nàn vì iframe hoặc bất kỳ nội dung nào màWindow đang trỏ đến không còn hiển thị vào thời điểm nó sẵn sàng thêm chính nó vào contentWindow. Bạn có thể xác minh điều này bằng cách nhấp vào chế độ xem của mình và sau đó đợi Số từ xuất hiện ở phía dưới bên phải của trình chỉnh sửa. Nếu bạn hủy ngay bây giờ, bạn sẽ không gặp vấn đề gì. Nếu không đợi, bạn sẽ gặp lỗi i.contentWindow is null. Để khắc phục, chỉ cần loại bỏ plugin:

if (CKEDITOR.instances['textarea_name']) 
{
   CKEDITOR.instances['textarea_name'].destroy();
}
CKEDITOR.replace('textarea_name', { removePlugins: "wordcount" } );

Nếu bạn cần bộ đếm từ, hãy đăng ký các sự kiện dán và gõ phím trên trình chỉnh sửa với chức năng đếm từ.

Đối với những người sử dụng "bộ điều hợp" jquery và gặp sự cố (như tôi đã từng), giải pháp siêu hackish nhưng vẫn hoạt động là làm điều gì đó như sau:

// content editor plugin
(function($){
    $.fn.contentEditor = function( params ) {
        var xParams = $.extend({}, $.fn.contentEditor.defaultParams, params);
        return this.each( function() {   
            var $editor = $(this);
            var $params = $.extend({}, xParams, $editor.data());

            // if identifier is set, detect type based on identifier in $editor
            if( $params.identifier.type ) {
                $params.type = $editor.find($params.identifier.type).val();
            }

            $editor.data('type', $params.type);

            // edit functionality
            editButton = $('<button>Edit Content</button>').on('click',function(){
                // content container
                var $cc = $('#' + $editor.data('type'));

                // editor window
                var $ew = $('<form class="editorWindow" />');
                $ew.appendTo('body');

                // editor content
                $ec = $('<textarea name="editorContent" />').val($cc.html());
                $ec.appendTo($ew);
                $ec.ckeditor();


                //$ec.ckeditorGet().setMode('source');


                $ew.dialog({
                    "autoOpen": true,
                    "modal": true,
                    "draggable": false,
                    "resizable": false,
                    "width": 850,
                    "height": 'auto',
                    "title": "Content Editor",
                    "buttons": { 
                        'Save': function() {                            
                            $cc.html( $ec.val() );
                            $ec.ckeditorGet().destroy(); 
                            $ew.remove();
                        },
                        'Cancel / Close': function() { 

                            $ec.ckeditorGet().destroy();                        
                            $ew.remove();
                        }
                    },
                    'close': function() {
                        $ec.ckeditorGet().destroy(); 
                    },
                    'open': function() {
                        $ew.find('a.cke_button_source').click();

                        setTimeout(function(){
                            $ew.find('a.cke_button_source.cke_on').click();
                        }, 500);
                    }
                });

                return false;
            });

            editButton.appendTo( $editor );

        });
    }

    // set default option values
    $.fn.contentEditor.defaultParams = {
        'identifier': {
            'type': 'input[name="type"]'
        }
    };   

})(jQuery);   

$(function(){

    $('form.contentEditor').contentEditor();

});

Điểm mấu chốt là phần này:

                'open': function() {
                    $ew.find('a.cke_button_source').click();

                    setTimeout(function(){
                        $ew.find('a.cke_button_source.cke_on').click();
                    }, 500);
                }

Điều này khắc phục sự cố không hiển thị văn bản trình chỉnh sửa vào lần tiếp theo bạn mở hộp thoại. Tôi nhận ra rằng điều này là rất hack, nhưng xem xét rằng hầu hết trong số này sẽ được sử dụng cho các công cụ quản trị, tôi không nghĩ rằng đó là mối quan tâm lớn như bình thường .. và điều này hoạt động, vì vậy hy vọng nó sẽ cứu ai đó thời gian ;)

Đây là mã hoạt động đầy đủ cho jquery .load () api và ckeditor, trong trường hợp của tôi, tôi đang tải một trang có ckeditor thành div với một số hiệu ứng jquery. Tôi hy vọng nó sẽ giúp bạn.

 $(function() {
            runEffect = function(fileload,lessonid,act) {
            var selectedEffect = 'drop';
            var options = {};
            $( "#effect" ).effect( selectedEffect, options, 200, callback(fileload,lessonid,act) );
        };
        function callback(fileload,lessonid,act) {
            setTimeout(function() {//load the page in effect div
                $( "#effect" ).load(fileload,{lessonid:lessonid,act:act});
                 $("#effect").show( "drop", 
                          {direction: "right"}, 200 );
                $("#effect").ajaxComplete(function(event, XMLHttpRequest, ajaxOptions) {
                    loadCKeditor(); //call the function after loading page
                });
            }, 100 );   
        };

        function loadCKeditor()
        {//you need to destroy  the instance if already exist
            if (CKEDITOR.instances['introduction']) 
            {
                CKEDITOR.instances['introduction'].destroy();
            }
            CKEDITOR.replace('introduction').getSelection().getSelectedText();
        }
    });

===================== button for call the function ================================

<input type="button" name="button" id="button" onclick="runEffect('lesson.php','','add')" >

Nó khá đơn giản. Trong trường hợp của tôi, tôi đã chạy phương thức jquery dưới đây sẽ hủy các phiên bản ckeditor trong quá trình tải trang. Điều này đã thành công và giải quyết được vấn đề -

Phương thức JQuery -

function resetCkEditorsOnLoad(){

    for(var i in CKEDITOR.instances) {
        editor = CKEDITOR.instances[i];
            editor.destroy();
            editor = null;
    }
}

$(function() {

            $(".form-button").button();
    $(".button").button();

    resetCkEditorsOnLoad(); // CALLING THE METHOD DURING THE PAGE LOAD

            .... blah.. blah.. blah.... // REST OF YOUR BUSINESS LOGIC GOES HERE

       });

Đó là nó. Tôi hy vọng nó sẽ giúp bạn.

Chúc mừng, Sirish.

Chức năng này hoạt động đối với tôi trong CKEditor phiên bản 4.4.5, nó không có bất kỳ rò rỉ bộ nhớ nào

 function CKEditor_Render(CkEditor_id) {
        var instance = CKEDITOR.instances[CkEditor_id];
        if (CKEDITOR.instances.instance) {
            CKEDITOR.instances.instance.destroy();
        }
        CKEDITOR.replace(CkEditor_id);
    }

// gọi hàm này như bên dưới

var id = 'ckeditor'; // Id of your textarea

CKEditor_Render(id);

CKeditor 4.2.1

Có rất nhiều câu trả lời ở đây nhưng đối với tôi, tôi cần một cái gì đó nhiều hơn (hơi bẩn quá nên nếu ai có thể cải thiện, vui lòng làm). Đối với tôi MODALs nơi vấn đề của tôi.

Tôi đang kết xuất CKEditor theo một phương thức, sử dụng Foundation. Lý tưởng nhất là tôi sẽ hủy biên tập khi đóng cửa, tuy nhiên tôi không muốn gây rối với Foundation.

Tôi đã gọi là xóa, tôi đã thử xóa và một phương pháp khác nhưng đây là những gì cuối cùng tôi đã giải quyết.

Tôi đang sử dụng textarea để điền không phải DIV.

Giải pháp của tôi

//hard code the DIV removal (due to duplication of CKeditors on page however they didn't work)

    $("#cke_myckeditorname").remove();


     if (CKEDITOR.instances['myckeditorname']) {
                delete CKEDITOR.instances['myckeditorname'];
                CKEDITOR.replace('myckeditorname', GetCKEditorSettings());
            } else {
                CKEDITOR.replace('myckeditorname', GetCKEditorSettings());
            }

đây là phương pháp của tôi để trả về định dạng cụ thể của tôi, mà bạn có thể không muốn.

    function GetCKEditorSettings()
    {
       return {
                    linkShowAdvancedTab: false,
                    linkShowTargetTab: false,
                    removePlugins: 'elementspath,magicline',
                    extraAllowedContent: 'hr blockquote div',
                    fontSize_sizes: 'small/8px;normal/12px;large/16px;larger/24px;huge/36px;',
                    toolbar: [
                        ['FontSize'],
                        ['Bold', 'Italic', 'Underline', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink'],
                        ['Smiley']
                    ]
                };
    }

Thử cái này:

for (name in CKEDITOR.instances)
{
    CKEDITOR.instances[name].destroy(true);
}