tinymce - 如何禁用tinymce编辑器

标签 tinymce wysiwyg javascript

我想使用 Javascript 禁用 tinymce 编辑器。实际上,我有两个单选按钮:1) On 和 2) Off

当用户选择 Off 单选按钮时,我的 tinymce 编辑器应该是 readonly/disabled & 当用户选择 On 单选按钮时,我的 tinymce 编辑器应该是enabled

我怎样才能做到这一点?

已编辑:-(因为它在 IE8 中不起作用)

tinyMCE.init({
    force_p_newlines : false,
    force_br_newlines : false,
    forced_root_block : false,
    convert_newlines_to_brs: false,
    // Not to add br elements.
    remove_linebreaks : true,

    mode : "textareas",
    theme : "advanced",
    plugins : "safari",
    convert_urls : false,
    width : "560",
    height : "15",
    theme_advanced_buttons1 : "fontselect,fontsizeselect, separator, bold,italic,underline,separator,forecolor,backcolor,justifyleft,justifycenter,justifyright,justifyfull",

    theme_advanced_buttons2 : "",
    theme_advanced_buttons3 : "",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left", extended_valid_elements : "a[name|href|target|title|onclick],img[class|src| border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name], hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]"
});

此代码用于禁用:

function tinymce_state(id, disable){
    var state = (disable==true)? 'Off' : 'On'
    tinymce.get(id).getDoc().designMode = state;
    tinymce.get(id).controlManager.get('fontselect').setDisabled(disable);
    tinymce.get(id).controlManager.get('fontsizeselect').setDisabled(disable);
    tinymce.get(id).controlManager.get('bold').setDisabled(disable);
    tinymce.get(id).controlManager.get('italic').setDisabled(disable);
    tinymce.get(id).controlManager.get('underline').setDisabled(disable);
    tinymce.get(id).controlManager.get('forecolor').setDisabled(disable);
    tinymce.get(id).controlManager.get('backcolor').setDisabled(disable);
    tinymce.get(id).controlManager.get('justifyleft').setDisabled(disable);
    tinymce.get(id).controlManager.get('justifycenter').setDisabled(disable);
    tinymce.get(id).controlManager.get('justifyright').setDisabled(disable);
    tinymce.get(id).controlManager.get('justifyfull').setDisabled(disable);
}

最佳答案

您可以使用以下内容来阻止编辑器中的输入:

// blockeditor input
tinymce.get('editor_id').getDoc().designMode = 'Off'; // switches editable off

// turn it on again
tinymce.get('editor_id').getDoc().designMode = 'On'; // switches editable on

您仍然需要找到一种方法来阻止 tinymce UI。您可以使用一行来停用您已加载的每个控件(在 init 函数中)

// example control bold
tinymce.get('editor_id').controlManager.get('bold').setDisabled(true);

// turn it on again
tinymce.get('editor_id').controlManager.get('bold').setDisabled(false);

编辑:

您可以更改 rtes iframe 主体的 contenteditable 属性。 缺点是您将不得不单独禁用 tinymce UI(按钮)

// disable contenteditable
tinymce.get('editor_id').getBody().setAttribute('contenteditable', 'false');

// enable contenteditable
tinymce.get('editor_id').getBody().setAttribute('contenteditable', 'true');

关于tinymce - 如何禁用tinymce编辑器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5456363/

相关文章:

javascript - 当我选择带有 Object 的选项时,"[object Object]"而不是 Object 被传递给 <select> 的 ng-model

javascript - 简单的 AIR 通知应用程序(菜鸟)

javascript - TinyMCE - 如何为每个模板添加自定义插入模板按钮

javascript - 让js打印html而不是纯文本

TinyMce 编辑器文本框不可编辑

javascript - 为我的 tinymce 编辑器进行 HTML 清理

internet-explorer - CKEditor > IE > contentEditable 区域内可调整大小的框架,如何禁用它?

reactjs - Draft-js 无法读取未定义的属性 'getIn' ( getUpdatedSelectionState )

html - 创建基于 <canvas> 的 HTML5 文本编辑器

javascript - 使用用户输入更改宽度大小时出现问题