如何从文本编辑器中删除菜单项(文件、编辑、视图、格式)和使用 JavaScript 的 TinyMCE 编辑器的字符限制



如何从文本编辑器中删除菜单项(文件,编辑,视图,格式)和使用JavaScript的TinyMCE编辑器的字符限制验证,我正在遵循以下示例:http://www.aspsnippets.com/Articles/Character-Count-and-Character-Limit-validation-for-TinyMCE-editor-using-JavaScript.aspx

 <div>
 <textarea id="txtTinyMCE" rows="2" cols="20"></textarea>
 <br />
 <div id="character_count">
 </div>
 <br />
 <input type="submit" value="Submit" onclick="return ValidateCharacterLength();" />
 <script type="text/javascript" src="//tinymce.cachefly.net/4.0/tinymce.min.js"></script>
</div>

用于限制最大字符数的 Java 脚本代码:

 <script type="text/javascript" src="//tinymce.cachefly.net/4.0/tinymce.min.js"></script>
  <script type="text/javascript">
window.onload = function () {
    tinymce.init({
        selector: 'textarea',
        width: 400,
        setup: function (ed) {
            ed.on('keyup', function (e) {
                var count = CountCharacters();
                document.getElementById("character_count").innerHTML = "Characters: " + count;
            });
        }
    });
}
function CountCharacters() {
    var body = tinymce.get("txtTinyMCE").getBody();
    var content = tinymce.trim(body.innerText || body.textContent);
    return content.length;
};
function ValidateCharacterLength() {
    var max = 3000;
    var count = CountCharacters();
    if (count > max) {
        alert("Maximum " + max + " characters allowed.")
        return false;
    }
    return;
}
</script>

从TinyMCE菜单栏的文档来看,您可以配置设置中显示的内容。在您的情况下,您将在 window.onload 函数中添加您的配置。

tinymce.init({
    menu : { // this is the complete default configuration
        file   : {title : 'File'  , items : 'newdocument'},
        edit   : {title : 'Edit'  , items : 'undo redo | cut copy paste pastetext | selectall'},
        insert : {title : 'Insert', items : 'link media | template hr'},
        view   : {title : 'View'  , items : 'visualaid'},
        format : {title : 'Format', items : 'bold italic underline strikethrough superscript subscript | formats | removeformat'},
        table  : {title : 'Table' , items : 'inserttable tableprops deletetable | cell row column'},
        tools  : {title : 'Tools' , items : 'spellchecker code'}
    }
});

据我所知,我假设隐藏一个项目,你只需要将其设置为 false。

最新更新