16

TinyMCE 4 の新しい file_picker_callback 関数で独自のカスタム ファイル ピッカーを使用しています。これに関するドキュメントは素晴らしいものではないので、ここまで私を導いてくれた Fred に感謝します - https://stackoverflow.com/a/24571800/2460995

カスタム ファイル ピッカーが機能しており、画像をクリックすると、「ソース」と「寸法」が入力されます。「画像の説明」フィールドにも自動的に入力する方法があるかどうか疑問に思っています。

画像の情報はデータベース テーブルから生成されるため、既に説明があり、ユーザーのために自動的に入力するとよいでしょう。データを戻すさまざまな方法を試した後、それがどのように行われるかを理解するのに苦労しています。

TinyMCE のコード:

tinymce.init({
    ...
    file_picker_callback: function(callback, value, meta) {
        myImagePicker(callback, value, meta);
    }
});

function myImagePicker(callback, value, meta) {
    tinymce.activeEditor.windowManager.open({
        title: 'Image Browser',
        url: '/media/browser/1?type=' + meta.filetype,
        width: 800,
        height: 550,
    }, {
        oninsert: function (url) {
            callback(url);
        }
    });
};

カスタム ファイル ピッカーのコード:

$(function(){
    $('.img').on('click', function(event){
        mySubmit('/upload/' + $(this).data('filename'));
    });
});

function mySubmit(url) {
    top.tinymce.activeEditor.windowManager.getParams().oninsert(url);
    top.tinymce.activeEditor.windowManager.close();
}

私のjavascriptの知識は、私がまったく新しいので、まだ最高ではありません.

4

1 に答える 1

15

私は同じ問題を抱えていて、次の解決策を思いつきました：

  1. 関数を次のように更新します(関数への新しいパラメーターにmyImagePicker注意してください)。objValsoninsert

    function myImagePicker(callback, value, meta) {
    tinymce.activeEditor.windowManager.open({
        title: 'Image Browser',
        url: '/media/browser/1?type=' + meta.filetype,
        width: 800,
        height: 550,
    }, {
        oninsert: function (url, objVals) {
            callback(url, objVals);
        }
    });
};

  2. 関数を次のように更新します(に渡されるパラメーターにmySubmit注意してください)。objValsoninsert

    function mySubmit (url, objVals) {
    top.tinymce.activeEditor.windowManager.getParams().oninsert(url, objVals);
    top.tinymce.activeEditor.windowManager.close();
    return false;
}

  3. mySubmitオブジェクトを埋めるために呼び出す場所を更新しobjValsます。

    例えば：

    mySubmit("https://google.com", { text: "Go To Google", target: '_blank' });

    objVals呼び出し元のダイアログの種類に基づいて変更するために入力するプロパティは、(部分的に)ここに記載されています。

    リンク ダイアログの場合:

    mySubmit("https://google.com", { text: "Go To Google", target: '_blank' });

    画像ダイアログの場合:

    mySubmit("image.jpg", { alt: "My image" });

    メディアダイアログの場合:

    mySubmit("movie.mp4", {source2: 'movie-alt.ogg', poster: 'movie-image.jpg'});
于 2014-09-11T21:18:37.793 に答える