3

カラーボックスを介して表示されるポップアップにwysiHtml5テキスト領域があります。

$j.colorbox({
                inline: true,
                href: "#popup",
                scrolling: false,
                onLoad: function() {
                    $('#cboxClose').remove();
                },
                onCleanup: function () {
                    $j("div#popup").hide();

                },
                onClosed: function () {
                    editor = null;
                },
                onComplete: function () {

                    var editor = new wysihtml5.Editor("wysiwygText", { // id of textarea element
                        toolbar: "wysihtml5-toolbar", // id of toolbar element
                        parserRules: wysihtml5ParserRules, // defined in parser rules set 
                        stylesheets: ["Styles/wysihtml5.css", "Styles/wysihtml5.css"]
                    });


                }
            });

エディターは、カラーボックスが最初にポップアップしたときに正常に機能します。ただし、閉じて再度開いた場合、ユーザーはエディターをクリックできません。

エディターオブジェクトを再作成しようとしているのは私と関係があるのでしょうか。問題は、カラーボックスを起動する前に作成すると、カラーボックスの起動時にエディタが「壊れて」しまうことです。（つまり、＃popupを表示するように設定すると、ページの読み込み時に編集できますが、カラーボックスを起動すると、コンテンツを再度編集できなくなります。

動作は、テキスト領域は表示されますが、「クリック」することはできません。

4

2 に答える 2

2

これは役に立たないかもしれませんが、私はこのような問題を抱えていました。要素がダイアログに設定された後、エディターを作成する必要がありました。

              $(".addtext").click(function(){

                    $("#editorcontainer").dialog({
                        width: 737
                    });

                    (function($){
                        $("#wysihtml5-textarea").wysihtml5(); 
                    })($1_7_2);

                });

唯一の問題は、ダイアログを同時に開くwysihtml5エディターの重複です。修正したらまた投稿します。

編集：私はおそらく、何が起こっているのかを本当に理解するためにwysihtml5コードを調べるのに時間をかける必要がありますが、今はあまり多くの時間を費やすことはできません。wysihtml5（）が呼び出されるたびに、エディターがdom要素を作成していることに気付きました。これは複製された要素を作成していたため、ダイアログを開いたときにコンテナ要素を使用してその内部コンテンツを作成し、ダイアログを閉じたときにその内部コンテンツを破棄するというアイデアです。ちなみに、プログラマーが自分のデザインを文書化しないとき、私はそれを本当に嫌います。

//button click event
$(".addtext").click(function(){
        $("#editorcontainer").dialog({
             width: 737,

             open: function(event, ui){
                  //create inner html
                  $(this).html("<form><textarea id=\"wysihtml5-textarea\" \
                  placeholder=\"Enter your text ...\" \
                  autofocus></textarea></form>");
             },

             close: function(event, ui){
                  //remove inner html
                  $(this).html("");
              }

          });

          //older version of jQuery aliased to $1_7_2
          (function($){
               //invoke the editor
               $("#wysihtml5-textarea").wysihtml5(); 
           })($1_7_2);

 });
于 2013-03-25T03:17:43.497 に答える
0

この関数を削除し、ポップアップを閉じたときにエディターインスタンスを破棄しないとどうなりますか。

onClosed: function () {
  editor = null;
}

javascriptコンソールにエラーがありますか？

于 2013-03-21T11:02:31.323 に答える