1

CMS のエディターとして redactor を使用しており、ユーザーは画像の選択/アップロード機能に非常に満足しています。

通常、リダクターは、必要なテキスト フィールドで redactor メソッドを呼び出すことによってアクティブ化されますが、これは素晴らしいことです。私がやりたいのは、編集されたテキストフィールドの外でも画像のドラッグアンドドロップアップロード/選択を使用することです。ユーザーが画像を選択しているこのサイトのすべての場所で使用したいと思います。

この機能に直接接続して成功した人はいますか?

ありがとう、

4

1 に答える 1

1

わかりました、これがあなたがやろうとしていることだと思います:

$('image-upload-tag').redactor({
    allowedTags: ['img'],  // We only want images
    buttons: ['image'],  // Only display the image button in the toolbar
    placeholder: "Drop images here…",  // Just to give some user info
    focusCallback: function() {
        // This stops the caret from being visable, it’s not necessary
        // but stops it looking like the user should be able to type.
        this.getEditor().css('color', 'transparent');
    },
    keydownCallback: function(e) {
        // Loose focus everytime a key is pressed.
        this.getEditor().blur();
    }
});

基本的に、通常どおりにリダクター エリアを設定します。許可されるタグとツールバーに表示するボタンにいくつかの制限を設定しました。エンドユーザーを混乱させないように、プレースホルダーを追加し、点滅するキャレットを透明にしました。おそらく、ここではなく css で透過ビットを実行する必要があります。

これkeydownCallbackは、実際にテキストが追加されないようにする機能です。本当に簡単です。キーが押されるたびに、要素からフォーカスを取り除くだけです。this.getEditor編集可能なリダクター領域を返すのでblur()、適用できます。これにより、他のアクション (キーバインディング、画像のドロップなど) が正常に機能します。

それがあなたが探していたものではない場合はお知らせください。

于 2014-01-19T03:02:22.910 に答える