HTMLBox 4.0.3：HTMLBoxとjqueryモーダルダイアログで問題が発生しました。私が使用しています

Question

を助ける必要があります。

FireFox 4.0 
jquery 1.5.1 
jquery UI 1.8.13 
HTMLBox 4.0.3 

私のジャバスクリプトを次のようになります

$(document).ready(function() { 
var box; 
box = $("#EmailContent").htmlbox({ 
    about: false, 
    idir: "/pics/", 
    toolbars: [ 
    ["cut", "copy", "paste", "separator", "bold", "italic", "underline", "strike", "sub", "sup", "separator", 
    "left", "center", "right", "justify", "separator", "ol", "ul", "indent", "outdent", "separator", "link", "unlink", "image"], 
    ["code", "removeformat", "striptags", "separator", "quote", "paragraph", "hr"]] 
}); 

$(":button").not("#save").click(function() { 
    var myClass = $(this).attr("class"); 
    box.set_text($("div.body." + myClass).html()); 

    //change the title of our modal dialog 
    $("#edit").dialog("option", "title", ("Edit ")); 

    var my_buttons = {}; 
    my_buttons["Save"] = function() { 
     saveInventory(); 
    }; 

    my_buttons["Cancel"] = function() { 
     $('#edit').dialog("close"); 
    };   

    $('#edit').dialog({ 
     buttons: my_buttons 
    }); 

    $("#edit").dialog("open"); 

}); 

$('#edit').dialog({ 
    autoOpen: false, 
    height: 450, 
    width: 700, 
    modal: true 
}); //end dialog box  
}); 

私は（私はモーダルのタイトルを変更したところから、基本的にすべて）は、すべてのjQueryのダイアログに追加する前に上記のコードはHTMLBoxを生成し、正しく動作します...私はHTMLBoxと対話できます。

ただし、ダイアログコードを追加するとHTMLBoxが壊れます。 HTMLボックスのテキストエリアはフォーカスを許可しません。

Firebugを使用して作業と非作業を比較すると、1つの違いが見つかりました。作業コピーはHTMLBoxによって生成されたタグに次のようにあります。

<link rel="stylesheet" href="data:text/css,body%7Bmargin%3A3px%3Bfont-family%3Averdana%3Bfont-size%3A11px%3B%7Dp%7Bmargin%3A0px%3B%7Dbody%7Bbackground%3Awhite%3B%7Dbody%7Bbackground-image%3Aurl%28/pics/logo.gif%29%3Bbackground-position%3Atop%20right%3Bbackground-repeat%3Ano-repeat%3B%7D"> 

誰もが、私はこの問題を解決する方法を上の任意のアイデアを持っていますか？ここ

検索はテキストエリアとモーダルダイアログの潜在的なFirefoxの問題をポップアップ：
FireFox textarea issue in modal dialog

Answer 1

を研究と実験の束の後、私は私の問題を解決しました。

明らかに、Firefox 4.0はjQuery UIダイアログ内でiFramesとうまく動作しません。

修正点は、HtmlBoxの初期化場所と移動方法を変更することです。代わりに上記の、私は次のようにそれを変更：、何らかの理由で

$(document).ready(function() { 
var box; 
var myClass; 


$(":button").not("#save").click(function() { 
    myClass = $(this).attr("class"); 
    $("#class").html(myClass); 
    $("#EmailTo").val($("div.to." + myClass).html()); 
    $("#EmailSubject").val($("div.subject." + myClass).html()); 

    //change the title of our modal dialog 
    $("#edit").dialog("option", "title", ("Edit ")); 

    var my_buttons = {}; 
    my_buttons["Save"] = function() { 
     if saveEmail() { 
      $('#edit').dialog("close"); 
     } 
    }; 

    my_buttons["Cancel"] = function() { 
     $('#edit').dialog("close"); 
    }; 

    $('#edit').dialog({ 
     buttons: my_buttons 
    }); 

    $("#edit").dialog("open"); 
}); 

$('#edit').dialog({ 
    autoOpen: false, 
    height: 450, 
    width: 700, 
    modal: true, 
    open: function(event, ui) { 
     if (box == null) { 
      box = $("#EmailContent").htmlbox({ 
       about: false, 
       idir: "/pics/", 
       css: "body{font-family:verada;font-size:11px;}", 
       toolbars: [ 
        ["cut", "copy", "paste", "separator", "bold", "italic", "underline", "strike", "sub", "sup", "separator", 
        "left", "center", "right", "justify", "separator", "ol", "ul", "indent", "outdent", "separator", "link", "unlink", "image"], 
        ["code", "removeformat", "striptags", "separator", "quote", "paragraph", "hr"]] 
      }); 
     } 

     box.set_text($("div.body." + myClass).html()); 
    } 
}); //end dialog box 

をjQueryのUIダイアログのオープンイベントにHtmlBoxための初期化コードを入れて、それが動作します。しかし、ボックス変数がnullであるかどうかを確認する必要があることがわかった場合、それ以外の場合は多くのエディタが必要になります。 iFrameのプラグインのために一般的にこれを拡大すること

、私は1つは、この朝のjQuery UIのダイアログ