JavaScript処理Iframe適応高さの問題

4037 ワード

1.同ドメイン名でのIframe適応高さの処理
<iframe  onload="Javascript:SetIFrameHeight(this)" src="../Home/b" id="win" name="win" width="100%" height="1"> </iframe>

もちろんここではAspを使っています.Net MVCここでsrcはルーティング構造に設定
<script type="text/javascript">  
  function SetIFrameHeight(obj) {
        var win = obj;
        if (document.getElementById) {
            if (win && !window.opera) {
                if (win.contentDocument && win.contentDocument.body.offsetHeight)
                    win.height = win.contentDocument.body.offsetHeight;
                else if (win.Document && win.Document.body.scrollHeight)
                    win.height = win.Document.body.scrollHeight;
            }
        }
    }
</script>

iframeネストされたページのロードが完了した場合、onloadイベントを使用してiframeにネストされたページの高さを取得し、Iframeの高さに値を付けるとよい.
2.ドメイン間でのIframe高さ適応
 
ホームフェースとネストされたiframeが異なるドメイン名の場合、JavaScriptのドメイン間制限を避ける必要があります.原理:既存iframeホームページmain.html、iframeにネストされたページiframe.html、iframe仲介ページagent.html 3つ、main.html(ドメイン名http://www.ccvita.com)ネストiframe.html(ドメイン名:http://www.phpq.net)は、ユーザが閲覧するとiframeを実行する.htmlのJavaScriptコードiframeCのscrアドレスにiframeページを入れる高さを設定します.agent.html(ドメイン名:http://www.ccvita.com)は伝達の高さを取得し、JavaScriptでmainを設定する.htmlのiframeの高さ.最終的に所期の目標を達成する.iframeホームページmain.html< !DOCTYPE html PUBLIC"-//W 3 C//TD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">iframeホームページ

末尾

iframeネストページiframe.html< !DOCTYPE html PUBLIC"-//W 3 C//TD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">iframeにネストされたページ
文字

















































文字
















function sethash(){    hashH = document.documentElement.scrollHeight;    urlC = "agent.html";    document.getElementByIdx("iframeC").src=urlC+"#"+hashH;}window.onload=sethash;
iframe仲介ページagent.html< !DOCTYPE html PUBLIC"-//W 3 C//TD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">iframe仲介ページ

function  pseth() {    var iObj = parent.parent.document.getElementByIdx('frame_content');    iObjH = parent.parent.frames["frame_content"].frames["iframeC"].location.hash;    iObj.style.height = iObjH.split("#")[1]+"px";}pseth();
コードではkimiが不完全mainを経路で表す可能性がある.htmlとagent.htmlは同じドメインでなければなりませんiframe.htmlは別のドメインにあります