我有一个 TinyMCE 4.x 实例,其中文本应处于只读模式。但我仍然有一些想要启用的按钮。例如,一个按钮可以提供我选择的文本部分的字符计数。
但是当我打开 TinyMCE 的只读模式时,所有按钮都被禁用。我可以只启用我的按钮,同时仍保留只读模式吗?
对您来说可能已经太晚了,但其他人可能会经过这里。
我想出了这个函数
function enableTinyMceEditorPlugin(editorId, pluginName, commandName) {
var htmlEditorDiv = document.getElementById(editorId).previousSibling;
var editor = tinymce.get(editorId);
var buttonDiv = htmlEditorDiv.querySelectorAll('.mce-i-' + pluginName.toLowerCase())[0].parentElement.parentElement;
buttonDiv.className = buttonDiv.className.replace(' mce-disabled', '');
buttonDiv.removeAttribute('aria-disabled');
buttonDiv.firstChild.onclick = function () {
editor.execCommand(commandName);
};
}
它通过两个步骤完成了这个技巧:
- 使按钮可点击(删除
mce-disabled
CSS 类并删除aria-disabled
财产)
- 将好的命令分配给单击事件
在我的编辑器中init
事件我调用该函数。
editor.on('init', function () {
if (readOnly) {
editor.setMode('readonly');
enableTinyMceEditorPlugin(htmlEditorId, 'preview', 'mcePreview');
enableTinyMceEditorPlugin(htmlEditorId, 'code', 'mceCodeEditor');
}
});
我为其编写此代码的 TinyMCE 当前版本是 4.4.3。它可能会在未来版本中出现问题,特别是关于获取和修改良好 HTML 元素的选择器。
命令标识符可以在以下位置找到这一页否则你也可以在下面找到它们tinymce\plugins\PluginName\plugin(.min).js
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)