2

私はMarkDownDeepで作業しています。SOと同様の「画像の挿入」機能があります。

この関数を拡張して、ユーザーが自分の画像をアップロードできるようにするブートストラップモーダルを使用するか、少なくともタイプアヘッドを機能させて、ユーザーが別のページからアップロードされたものを選択できるようにしたいと思います。

以下のプロンプトの代わりにコールバック関数を使用しようとしましたがstr、元の関数のようにテキスト ボックスに挿入されません。

pub.cmd_img = function (ctx) {
    ctx.TrimSelection();
    if (!ctx.CheckSimpleSelection())
        return false;

    imagePopUp(function(results) {

        $("#" + ctx.m_textarea.id).focus();

        var url = results;

        if (url === null)
            return false;

        var alttext = ctx.getSelectedText();
        if (alttext.length == 0) {
            alttext = "Image Text";
        }

        var str = "![" + alttext + "](" + url + ")";

        ctx.ReplaceSelection(str);
        ctx.m_selectionStart += 2;
        ctx.m_selectionEnd = ctx.m_selectionStart + alttext.length;
        return true;
    });
    return false;

uploadImageUrl現在、ユーザーがアップロードできるようにモーダル内でiframeを使用しているため、iframeが設定されるため、保持変数ですparent.uploadImageUrl

uploadImageUrl = "baz"; 
function imagePopUp(callback) {
    $('#imageUpload').modal('show');

    $('#confirmTrue').click(function () {
        $('#imageUpload').modal('hide');

        if (callback) callback(uploadImageUrl);
    });
}

オリジナル

 pub.cmd_img = function (ctx) {
        ctx.TrimSelection();
        if (!ctx.CheckSimpleSelection())
            return false;

        var url = prompt("Enter the image URL"); //need to change what this does

        if (url === null)
            return false;

        var alttext = ctx.getSelectedText();
        if (alttext.length == 0) {
            alttext = "Image Text";
        }

        var str = "![" + alttext + "](" + url + ")";

        ctx.ReplaceSelection(str);
        ctx.m_selectionStart += 2;
        ctx.m_selectionEnd = ctx.m_selectionStart + alttext.length;
        return true;
    };

あなたは私の動かないフィドルを見ることができます

4

2 に答える 2

4

これでうまくいくはずです:

pub.cmd_img = function(ctx){

   ctx.TrimSelection();
   if (!ctx.CheckSimpleSelection())
      return false;

   //call popup
   imagePopUp(function(results){

      $("#" + ctx.m_textarea.id).focus();

      var url = results;
      if (url === null)
         return false;

      var alttext = ctx.getSelectedText();
      if (alttext.length == 0){
         alttext = "Image Text";
      }

      var str = "![" + alttext + "](" + url + ")";
      var editor = $(ctx.m_textarea).data("mdd");

      editor.cmd_img_core = function(state){
         state.ReplaceSelection(str);
         state.m_selectionStart += 2;
         state.m_selectionEnd = state.m_selectionStart + alttext.length;
         return true;
      };

      editor.InvokeCommand("img_core");
      delete editor.cmd_img_core;
   });             
   return false;
};
于 2012-11-20T13:19:33.933 に答える
1

このコードには問題がありました。エディターに 2 番目の画像を挿入しようとすると、URL が 2 回挿入され、3 番目の画像が 3 回挿入されるなどです。挿入された画像の数と同じ回数、imagePopup コールバックを実行しているように見えました。以下の変更で問題を解決しました。完璧ではありませんが、機能します:

var isImageInserted = false; 
pub.cmd_img = function (ctx) {
    ctx.TrimSelection();
    if (!ctx.CheckSimpleSelection())
        return false;

    isImageInserted = false;
    //call popup
    imagePopUp(function (results) {

        $("#" + ctx.m_textarea.id).focus();

        var url = results;
        if (url === null)
            return false;

        var alttext = ctx.getSelectedText();
        if (alttext.length == 0) {
            alttext = "Image Text";
        }
        var str = "";
        if (!alttext.indexOf(url) > -1) {
            str = "![" + alttext + "](" + url + ")";
        } else {
            str = alttext;
        }

        var editor = $(ctx.m_textarea).data("mdd");
        if (!isImageInserted) {
            editor.cmd_img_core = function (state) {
                state.ReplaceSelection(str);
                state.m_selectionStart += 2;
                state.m_selectionEnd = state.m_selectionStart + alttext.length;
                isImageInserted = true;
                return true;
            };

            editor.InvokeCommand("img_core");
            delete editor.cmd_img_core;
        }

    });
    return false;

}

ほとんどすべてのマークダウンディープ検索がここに来るように見えるので、これが他の誰かに役立つことを願っています.

于 2014-02-13T10:12:22.853 に答える