jQueryを使用してブラウザの高さを判断せずにiframeの適応高さの問題を解決する

ここでは、ブラウザの高さと幅を決定するために何も書く必要のない 2 つの非常に簡単な方法を紹介します。

以下の 2 つの方法のいずれかを選択してください。 1 つは iframe と同じページに配置され、もう 1 つは test.html ページに配置されます。

間違った場所に置かないように注意してください。
iframeコード内にIDが無いと見つからないので注意してください

。

コードをコピーします コードは次のとおりです:

方法 1:

コードをコピーします コードは次のとおりです:

//注: 次のコードは iframe と同じページに配置され、
と呼ばれます。 $("#main").load(function(){
var mainheight = $(this).contents().find("body").height() 30;
$(this).height(mainheight);
});

方法 2:

コードをコピーします コードは次のとおりです:

//注:
を呼び出すために、次のコードが test.html に配置されています。 $(window.parent.document).find("#main").load(function(){
var main = $(window.parent.document).find("#main");
var thisheight = $(document).height() 30;
main.height(この高さ);
});

プロジェクトで作業する過程で iframe を使用する必要がありますが、iframe にはデフォルトで高さが設定されており、デフォルトの高さを超えるコンテンツは非表示になり、デフォルトの高さより小さいコンテンツはデフォルトの高さを使用します。答えを探す過程で、iframe の高さの適応を制御する方法を発見しました

iframe の適応高さ自体は非常に単純な方法で、ページが読み込まれた後に高さを再計算します。

コードは次のとおりです:

コードをコピーします コードは次のとおりです:

//パブリック メソッド: すべてのデータが表示されるように iframe の高さを設定します
//関数 SetPageHeight() {
// var iframe = getUrlParam('ifname');
// var myiframe = window.parent.document.getElementById(iframe);
// iframeLoaded(myiframe);
//}
var iframeLoaded = 関数 (iframe) {
If (iframe.src.length > 0) {
If (!iframe.readyState || iframe.readyState == "完了") {
var bHeight =
iframe.contentWindow.document.body.scrollHeight;
var dHeight =
iframe.contentWindow.document.documentElement.scrollHeight;
var height = Math.max(bHeight, dHeight);
iframe.height = 高さ;
}
}
}
// ページング中に iframe の高さを変更後リセットします: iframe.name = iframe.id
var reSetIframeHeight = function()
{
{
を試してください var oIframe =parent.document.getElementById(window.name);
oIframe.height = 100;
iframeLoaded(oIframe);
}
キャッチ（エラー）
{
{
をお試しください parent.document.getElementById(window.name).height = 1000;
} catch (err2) { }
}
}

reSetIframeHeight() メソッドを呼び出します。