CKeditor使內聯編輯器只讀

Question

我使用ckeditor的內聯編輯器來創建html內容。我如何才能使其只讀並僅顯示預覽模式的內容。我嘗試了以下配置，但它不適合我。

this.editorInstance.setReadOnly(true); 

這裏this.editorIntance是我的編輯。我只想在預覽模式下顯示內容，而不想顯示編輯器的工具欄。

Answer 1

使用以下腳本使CKeditor只讀。在toggleReadOnly函數中傳遞「true」或「false」參數以使ckeditor被禁用或相應啓用。

var editor; 

// The instanceReady event is fired when an instance of CKEditor has finished 
// its initialization. 
CKEDITOR.on('instanceReady', function (ev) { 
    editor = ev.editor; 

    // Show this "on" button. 
    document.getElementById('readOnlyOn').style.display = ''; 

    // Event fired when the readOnly property changes. 
    editor.on('readOnly', function() { 
     document.getElementById('readOnlyOn').style.display = this.readOnly ? 'none' : ''; 
     document.getElementById('readOnlyOff').style.display = this.readOnly ? '' : 'none'; 
    }); 
}); 

function toggleReadOnly(isReadOnly) { 
    // Change the read-only state of the editor. 
    // http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-setReadOnly 
    editor.setReadOnly(isReadOnly); 
} 

請參閱工作演示：https://jsfiddle.net/rbua57pq/3/