如何在CKEditor中设置按钮的标题?
在CK编辑器中,当用户将鼠标悬停在相应的按钮上时,我希望显示相应的快捷键 例如,当我将鼠标悬停在“B”上时,它会显示“Bold”,但我希望它显示“Bold Ctrl+B”。这类似于MS Word甚至Stack Overflow的编辑器。我该怎么做 我的想法是在编辑器加载后对按钮文本进行更改 例如:如何在CKEditor中设置按钮的标题?,ckeditor,Ckeditor,在CK编辑器中,当用户将鼠标悬停在相应的按钮上时,我希望显示相应的快捷键 例如,当我将鼠标悬停在“B”上时,它会显示“Bold”,但我希望它显示“Bold Ctrl+B”。这类似于MS Word甚至Stack Overflow的编辑器。我该怎么做 我的想法是在编辑器加载后对按钮文本进行更改 例如: // Invalid Code - Just an example editor.setButtonText('codeSnippet', config.lang.codesnippet.title
// Invalid Code - Just an example
editor.setButtonText('codeSnippet', config.lang.codesnippet.title + " - Ctrl + K"));
当然,上面的代码是无效的,因为我不确定如何设置按钮文本
更新
我现在知道如何检索按钮的按钮文本。i、 e
config.lang.codesnippet.title
但是我无法设置标题的值。以前的帖子,但其他人可能也有同样的问题,我发现了一个解决方法:你可以手动覆盖按钮的
标题属性
CKEditor按类引用工具栏按钮。“粗体”按钮具有以下类别:cke\u按钮cke\u按钮cke\u粗体cke\u按钮关闭
您只需获取HTML元素的引用(getElementsByClass()
在普通JavaScript中),并使用.setAttribute()
我的项目位于Angular2,因此在我的案例中,它看起来如下所示:
this.elRef.nativeElement.querySelector('.cke_button.cke_button__bold').setAttribute('title','bold(Ctrl+B)')代码>
在纯JS中,它看起来像:
document.getElementsByClass('.cke_button.cke_button__bold')[0].setAttribute('title','bold(Ctrl+B)')代码>
以下是一些按钮的列表(不全面):
粗体:cke\u按钮cke\u按钮cke\u粗体cke\u按钮关闭
斜体:cke\u按钮cke\u按钮斜体cke\u按钮关闭
下划线:cke\u按钮cke\u按钮cke\u下划线cke\u按钮关闭
项目符号列表:cke\u按钮cke\u按钮项目符号列表cke\u按钮关闭
编号列表:cke\u按钮cke\u按钮cke\u编号列表cke\u按钮关闭
…以此类推。在CKEditor跟踪器上实际上有此功能的票证:。您可以按照它来查看何时实现。它现在计划在CKEditor 4.6中发布,目前正在审查中。希望能在CKEditor 4.6版本中发布。如果一张票证正在审查中,这是否意味着它可能无法发布。