summernote を使用して WYSIWYG エディターを作成しました。私は編集者が本当に好きです。しかし、私はいくつかの機能を追加したいと考えています。
サーバーに既に存在する画像を挿入する機能がありません。画像をアップロードして、イベントeditor.insertImage(welEditable, url);
内で呼び出されるテキストエリアに挿入することができます。
しかし、ダイアログを表示して、ユーザーが既にアップロードされた画像を選択できるようにしたいと考えています。それをクリックすると、summernote エディタに画像が入力されます。onImageUpload
私が直面している問題は、summernote エディターとの接続です。URL を文字列形式でエディターに送信するにはどうすればよいですか?
これは私が今構築したものです:
$('#summernote').summernote(
{
...
oninit: function() {
//- construct button and add it to the ribbon
var catalogBtn = '<button id="catalogBtn" type="button" class="btn btn-normal" data-event="launchCatalog" tabindex="-1"><i class="icon-heart"></i></button>';
var fileGroup = '<div class="note-file btn-group">' + catalogBtn + '</div>';
$(fileGroup).appendTo($('.note-toolbar'));
//- add event listener for the click
$('#catalogBtn').click(function(event) {
showCatalog(editor);
});
}
})
function showCatalog(editor){
//- some dialog logic which eventually calls this
// for now the url is hard coded :)
editor.insertImage( XXXXXX , 'http://example.com/path/to/image.png)
}
X には何を使用する必要がありますか? summernote.js では $editable なので、編集可能なオブジェクトを参照しますか? しかし、どれですか?そして、どうすればライブラリからそれを取得できますか?