关闭并重新打开框后,无法访问colorBox中的wysihtml5文本区域

时间:2013-03-14 16:45:53

标签: jquery asp.net colorbox wysihtml5

我在弹出窗口中有一个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设置为可见,我可以在页面加载时编辑它,但是当我启动颜色框时,我再次无法编辑内容。

行为是我可以看到文本区域,但我无法“点击”它。

2 个答案:

答案 0 :(得分: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);

 });

答案 1 :(得分:0)

如果删除此功能,并且在弹出窗口关闭时不破坏编辑器实例,该怎么办?

onClosed: function () {
  editor = null;
}

你在javascript控制台中有错误吗?