サイズが必要かどうかを手動でjQueryダイアログチェックにします

StackOverflow https://stackoverflow.com/questions/4076256

  •  28-09-2019
  •  | 
  •  

質問

開いた後、コンテンツトラフajaxをロードするjQueryダイアログがあります。

これを参照してください jsfiddle （コンテンツにはAjaxがロードされていませんが、開いた後に追加されます。これは私の問題を示すのに十分です）。

HTML：

<div id="test">test</div>

JS：

$("#test").dialog({
    minHeight:100,
    maxHeight:200,
    width:300,
    open: function(){
        $(this).html("test<br /><br />test<br />" +
                     "<br />test<br /><br />test" +
                     "<br /><br />test<br /><br />" +
                     "test<br /><br />test<br />" +
                     "<br />test<br /><br />test");
    }
});

それが開かれたとき、それはその忠実なままではありません maxHeight ダイアログをサイズ変更するまで。ある種はありますか resize ダイアログにコンテンツを追加した後、電話をかけることができますか？

サイズが必要かどうか、そしてUIプラグインに既に組み込まれているため、どのくらい高いかを手動で把握する必要はありません。

役に立ちましたか？

解決 2

jsfiddle 例。

私が望んでいたエレガントなソリューションではありませんが、これまでのところうまくいくようです。

誰かがより良い解決策を持っているなら、私はそれを聞いてうれしいです。

他のヒント

Webapgeの実際のDivにHTMLコードを配置し、そのDivでダイアログを使用します。または、initの後に高さ（およびその他のオプション）を変更するために...から jquery docs :

//getter
var width = $( ".selector" ).dialog( "option", "height" );
//setter
$( ".selector" ).dialog( "option", "height", 460 );

オープン関数にmaxheightを設定すると、トリックがあるようです。

$("#test").dialog({
    minHeight:100,
    width:300,
    open: function(){
        $(this).html("test<br /><br />test<br /><br />test<br /><br />test<br /><br />test<br /><br />test<br /><br />test<br /><br />test<br /><br />test");
        $(this).parent().css("height", "auto");
        $(this).css("maxHeight", 200);
    }
});

編集：「テスト」divがダイアログとして使用されると、ヘッダーdivとともにダイアログDIV内にネストされるようになります。その結果、Test Divとその含有Divの両方が、ダイアログヘッダーDivの高さを考慮して、含まれるDivを使用して高さを設定する必要があります。自動車に高さを設定する必要があります。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top