1. ホーム
  2. Web制作
  3. HTML/Xhtml

iframeページ内で互いのjs関数を呼び出すためにjsを使用する

2022-02-04 02:42:58
最近、私は毎日論文のレポートに取り組んで、私は再びWebを設計するためにうずうずしていた、と私は問題に遭遇した。アイデアは、私はこの互換性に注意を払うためにページを設計し始め、今回私は互換性の問題に遭遇した、フローティングフレーム内のHTML、<フレーム&gtは、あなたがページ内にページを組み込むことができます、フレームページを行うために使用すると、次の図、非常に適切であり、その

htmlページを左右に分割し、左側にナビゲーションバー、右側に表示するコンテンツを配置したもので、以下のようなコードになっています。
左カラムのコードは
<IFRAME frameBorder=0 id=frmTitleLeft name=framLeft src="left.html" style="HEIGHT: 100%; width:180px;">.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX;
left.htmlへのリンク
右カラムも同様で、私が作ったページの場合、プレビューはこのようになります。

今すぐより実用的な効果を再生するためにどのような効果を達成するために、リンクのいずれかをクリックすると、右側の列に表示することができ、その後明らかにjsを介して達成する必要がある、元の互換性のないアプローチ私は多くを語っていない、次の手順を達成するために覚えておいてください。
1、最初に右列のiframeオブジェクトを取得する
var frames=document.getElementById("frameid");//frameid は右カラム iframe の id 名です。
2, srcの値をリセットする
frames.src=pageurl;//pageurlは表示される目的ページです。
これにより、ページジャンプが可能になります
しかし、もう一つ、関数の一つを呼び出したい場合は、それほど簡単ではありません。
例えば、右カラムにright()という関数があり、左カラムのリンク先でright()という関数を呼び出したい場合、どうすればいいのでしょうか?
1、まず、leftframeはコンテナページのindex.htmlに埋め込まれているので、まずindexレベルに戻ってrightframeオブジェクトを取得する必要があります。
var frames=window.parent.window.document.getElementById("frameid");
2、そのページ内の関数を実行できるようにするには、ウィンドウのオブジェクトを取得する必要があります、ここでは重要なオブジェクトcontentWindowは、このオブジェクトを取得すると、その中に関数を実行できるように、次のように。
frames.contentWindow.right()。
上記のコードは、IE6, Firefox3, chrome2.0に対応しており、すべて正常にテストを通過しています。