使用tinyMCE 4.2,每次用户单击编辑器内的任意位置时,我都需要更改(自定义)工具栏按钮的文本。
这是相关代码:
tinymce.init({
//code ommitted...
toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image jbimages navigationbutton glossary",
setup: function(editor){
//add "Glossary" button
editor.addButton('glossary', {
name: 'glossary',
text: 'Glossary',
onclick: function(){
/*
//commented on purpose
var button = this;
var updatedButtonText = "Some updated button text";
button.text = updatedButtonText;
*/
}
});//end addButton
editor.on('click', function(){
var updatedButtonText = "Some updated button text";
//update the button text:
editor.buttons.glossary.text = updatedButtonText; //doesn't work
window.parent.tinyMCE.activeEditor.buttons.glossary.text = updatedButtonText; //doesn't work either
//confirm changes:
console.log(editor.buttons.glossary.text); //correctly prints "Some updated button text"
console.log(window.parent.tinyMCE.activeEditor.buttons.glossary.text); //correctly prints "Some updated button text" as well
});
}//end setup
});//end tinymce.init
所以问题实际上是,虽然按钮对象的 text
属性确实发生了变化,但这种变化不会反射(reflect)在编辑器中,其中按钮文本仍然是“Glossary”。
有趣的是,如果我通过按钮的 onclick 函数执行完全相同的操作(因此,如果我取消注释注释的代码块),那么它会按预期完美工作 - 按钮文本会在编辑器中更新。
我花了几个小时在 TinyMCE 4 的文档中试图找到一些相关信息,但显然是徒劳的。有什么想法吗?
最佳答案
加载编辑器工具栏后,TinyMCE 不支持更改按钮的图标/文本。您可以更改按钮是否切换为“打开”或“关闭”(例如,当您将光标放在加粗或非加粗的文本上时,“粗体”按钮会执行什么操作),但您无法更改实际的文本/图标。
在编辑器完全加载后,用于定义术语表按钮的 JavaScript 对象仍在内存中,因此您可以对该对象执行某些操作,例如更改属性值或 console.log 该值,但 TinyMCE 不会返回并查看该按钮对象并在加载工具栏后更新按钮。
关于javascript - TinyMCE 4 在编辑器单击时更改工具栏按钮文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39496582/