0

nicEdit のコンテンツで満たされた固定幅 (800px) のボックスがあります。

ボックス内に入れられる内容の高さを知る必要があります。行数を数えると、長いテキストや画像、または異なるフォントサイズでは機能しません...

スクロールバーが表示されず、コンテンツよりも高くない高さでボックスを設定する高さを見つける必要があります。

<div style="width: 800px; overflow: hidden"><?= $contentbyuser; ?></div>

この「ページ」は、次のようなコードで iFrame に表示されます。

<iframe style="width: 800px;height:???px;" src="page.php"></iframe>

javascriptやjQueryを使用してiframeに設定する高さを見つけるにはどうすればよいですか?

4

2 に答える 2

1

ダミー要素を作成し、そこに HTML を挿入して、その高さを確認できます。

//create dummy
var $dummy = $('<div />').css({ position : 'absolute', left : -9999, width : 800 }).html(randomTextandImages);

//add dummy to the DOM
$("body").append($dummy);

//get the height of the dummy
var theHeight = $dummy.height();

//at this point we can remove the dummy from the DOM
$dummy.remove();

//set the height of the iframe
$("iframe").height(theHeight);

ダミー要素には、通常のコンテナーと同じ CSS を適用して、同じものをレンダリングする必要があることに注意してください。フォント プロパティは特に重要です (たとえば、font-size、font-weight、line-height など)。

位置を設定しabsolute、大きな負の left プロパティを与えると、これは画面外で発生するため、ユーザーはそれを認識しません。

また、過去にこれに問題があったかどうかは思い出せませんが、高さがゼロになっている場合は、ダミーの高さを取得するコードを短いタイムアウトに入れて、ダミーが高さを取得する前にレンダリングできます。

于 2013-09-24T18:46:40.907 に答える
0

コンテンツに基づいて div の高さを自動に設定します。次に、JavaScript でこれを行うことができます。

$("div").html(randomTextandImages);
var height = $('div').height();        // Give this to whoever will be using the iframe
于 2013-09-24T18:46:32.637 に答える