我正在尝试创建一个Ckeditor插件。我在工具栏中添加了一个按钮,该按钮将打开对话框,并在其中输入我们选择的单词,同义词将显示为警报,并在单击确定时显示数据将被插入ckeditor文本区域。
我要显示的是另一个对话框或弹出窗口,它将显示同义词而不是警报。
文件夹结构: ckeditor->插件-> lookup_synonyms 在lookup_synonyms内部,我有两个文件夹“对话框-> lookup_synonyms.js和图标-> lookup_synonyms.png和一个文件plugin.js”
plugin.js
CKEDITOR.plugins.add( 'lookup_synonyms', {
icons: 'lookup_synonyms',
init: function( editor ) {
editor.addCommand( 'lookup_synonyms', new CKEDITOR.dialogCommand( 'lookup_synonymsDialog' ) );
editor.ui.addButton( 'Lookup_synonyms', {
label: 'Lookup Synonyms',
command: 'lookup_synonyms',
toolbar: 'insert,0'
});
CKEDITOR.dialog.add( 'lookup_synonymsDialog', this.path + 'dialogs/lookup_synonyms.js' );
}
});
lookup_synonyms.js
CKEDITOR.dialog.add( 'lookup_synonymsDialog', function( editor ) {
return {
title: 'Find synonyms',
minWidth: 400,
minHeight: 100,
contents: [
{
id: 'tab-basic',
label: 'Input a word to find synonym',
elements: [
{
type: 'text',
id: 'abbr',
label: 'Input word',
validate: CKEDITOR.dialog.validate.notEmpty( "Abbreviation field cannot be empty." )
}
]
}
],
onOk: function() {
var dialog = this;
var abbr = editor.document.createElement( 'abbr' );
//abbr.setAttribute( 'title', dialog.getValueOf( 'tab-basic', 'title' ) );
//const newobj = abbr.setText( dialog.getValueOf( 'tab-basic', 'abbr' ) );
var x = dialog.getValueOf( 'tab-basic', 'abbr' );
fetch("https://api.datamuse.com/words?ml=" + x)
.then((resp) => resp.json())
.then (data =>
{
const obj = JSON.stringify(data);
const wordArr = data.map(obj => obj.word);
//console.log(wordArr);
//document.getElementById("id").innerHTML = wordArr;
abbr.setText( wordArr );
alert(wordArr);
})
var id = dialog.getValueOf( 'tab-basic', 'abbr' );
if ( id )
abbr.setAttribute( 'id', abbr );
editor.insertElement( abbr );
}
};
});