tinyMCE 4.2를 사용하여 사용자가 에디터의 아무 곳이나 클릭 할 때마다 (사용자 정의) 툴바 버튼의 텍스트를 변경해야합니다.TinyMCE 4 에디터에서 툴바 버튼 텍스트 변경
이 관련 코드 :
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
속성이 변화를 수행하는 동안,이 변화가 버튼 텍스트가 "용어집"을 유지 에디터에 반영되지 않고 있다는 점이다 . 흥미롭게도 단추의 onclick
함수를 통해 똑같은 작업을하면 (주석 된 코드 블록의 주석을 제거하면) 예상대로 완벽하게 작동합니다. 단추 텍스트는 편집기에서 업데이트됩니다.
TinyMCE 4의 문서에서 몇 가지 관련 정보를 찾으려고했지만 몇 시간 헛되이 보냈습니다. 어떤 아이디어?
와우, 나는 그것을 기대하지 않았습니다. 따라서 ** 버튼의 ** onclick 함수에서'text' 속성을 변경하면 실제로 버튼을 업데이트하지만 ** 편집기 **에서 'text' 속성이 변경되면 업데이트되지 않습니다 'onclick' 함수는? 왜냐하면 이런 경우, 왜 그런 식으로 디자인 될지 이해가되지 않습니다. – pazof
버튼 자체의 onClick에 코드를 넣더라도 UI에서 버튼의 텍스트를 변경할 수 없습니다. 행사. (JavaScript 객체에서는 변경되지만 툴바에서는 시각적으로 변경되지는 않습니다.) JS Fiddle이 작동하는지 보여줄 수 있습니까? –