iframe内のスクリプトを親から3つ実行する記述

Question

iframe内のスクリプトを親から3つ実行したいのです．親フレームのイベントハンドラ　input　とonclick="()"　を利用して１回のクリックで１）iframe内のHTMLを変更し　（iframe00.htmlからiframe01.htmlへ）２）iframe内のflvファイルを開始し（iframe01.htm内のflaverを実行しa.ｆｌｖを開始したい）３）iframe内の画像を変更したい（iframe0１.htmlでは同一table内で　a.gifを，iframe02ではb.gifを表示）現在までで出来ているのは以下のところまでで，上記１）と３）はできるのですが，２）は下記のごとく，onmouseoverとonclickを使用しないと，ｆｌｖが開始されません． changeA1のdocument・・・を　changeA2の中に入れても，iframeのHTMLと画像は変わりますが，動画が開始されません．私の実力では，希望している動作が可能か否かも解りません．可能か否か，可能であればどのように記述すればよいかご教示いただければ幸いです．１．親htmlのスクリプト，iframeの記述，およびイベントハンドラー

fujillin · Accepted Answer

#1、2です。残念ながら動画を表示できる環境にはないので、よくわかりませんが、横長と縦長を入替えるだけなら、必ずしも別ドキュメントにする必要は無いように思えますが？他のものと同じようにして、同じドキュメント内で表示してあげるのが自然かと思われます。もちろん、#1に書きましたように、HTMLを2種類用意しておいてパラメータを渡すのでも良いですが、その場合は「方法3」が一番簡単なように思われます。（この意味においては、#2の回答は想像違いでした。でも、横長のものが1種類だけならそちらは固定ソースでいけますね。）横長になった時にどのようなレイアウトになるのかがわかりませんが、例えば他の要素と重ねてしまっても良いのであれば動画の要素だけを浮かした形にしておいて（position:absolute)サイズを可変にしておくとか。他の要素も一緒にレイアウトを変えるのであれば、両方に共通できるHTMLマークアップにしておいて、簡単な手続きでレイアウトを変えられるようにしておくとか… ソースを拝見して、できればtableレイアウトは避けた方が良さそうです。（現在の傾向）また、同じ性格の要素に個々にサイズなどの属性やイベントを設定していると、ソースが長く見難くなるばかりですので、CSSの利用とイベントの設定方法を工夫したほうがよろしいかと思います。例えば、テーブルをやめて上述（↑）のオブジェクト部分だけposition;absoluteにした例を以下に。オブジェクトの代わりにdivを入れてありますが、サイズを変えて横長にしてみれば他のレイアウトは変わらずに重なって表示されることがわかると思います。また、イベントは右下の画像のロールオーバーの部分だけ例として設定してありますが、個々の画像にonmouseイベントを設定せずに、包含するdivに設定しておくことでソースが単純になるだけでなく、画像を入替えたり増減しても同じ効果が得られるようにすることが可能です。インプットの部分のイベントなども上記と同様の設定にした方が良さそうですし、引数もタグの中に書くと長くなってしまっているので、ソースの内に記しておいて表示しないような例にしてあります。また、オブジェクトのファイル名と画像のファイル名も同じ（拡張子が違うだけ）の様なので、リンク先のuriとして記すことで、関数呼び出し時に引数を不要とすることが可能になります。同じ位置関係に引数にあたる内容があるので、イベント関数側でその内容を取得して、必要に応じて拡張子を追加すればよいという理屈です。あまり良くは見ていないのですが、同じようなスクリプトがたくさん並んでいるように見受けられます。少し修正することで同じものはまとめられるのではないかと推測します。（CSSとスクリプトは外部ファイルにすることが可能ですので、HTMLソースを単純化しておくことで、内容の追加や修正が行ないやすくもなるはずです。）その他、個々に書いていると長くなりそうなので割愛いたしますが、何かのご参考にでもなれば… サイズ等は良くわからないので、元のままです。画像の数やuriなどは適当にテスト用に変わっています。 sample

Objectの代わりのDIV（サイズを変えてみてください）

文字のエリア

画像化した文字？のエリア

ひまわり電気点火大成功　　　　　　　　点火：W，Mtくんスターマイン 1 一応成功　　　　　　　　　　　　　点火：Nちゃんナイアガラ+扇まぁいいか・・・扇は綺麗　　　　点火：全員

fujillin · Answer

#1です。

＞２種のHTMLですが，そのtableセル内の内容も変えたかったのと，
＞出来るだけ少ない記述で出来ないか　という思いがあり
2種類作成するのであれば、内容は固定でよいのですよね？

もしそうであるなら、スクリプトでわざわざ変更するよりも、パラメータの内容もセットしたソースを直接記述しておいた方がスクリプトを記述する分だけ少なくなりませんか？
（外部スクリプトなので、スクリプトの長さは勘定にいれないとかいうのであれば、また別ですが…）
少なくともご提示のスクリプトは、直接HTMLソースに記述した場合よりも（多分）少なくはないと想像しますが。
（ほぼ「ソースの内容＋スクリプト」という記述になっているのでスクリプト分だけ長い）

#1にも記しましたように、1種類のhtmlファイルを複数の内容に対応できるようにしたいというのであれば、話は別ですが。

fujillin · Answer

よくわかってませんけれど、＞onmouseoverとonclickを使用しないと，ｆｌｖが開始されません確認できないので、想像での回答になりますが… 原因はタイミングの問題で、そのまま連続してスクリプトで実行しようとしても、ifarameの内容がロードされる前に実行してしまい、エラーになっているということではないでしょうか？ onclickにすると（人間の操作に）時間がかかるので、その間にたまたまロードが完了していると考えられます。それなので、通信環境が悪い場合は、クリックしても反応しない（最初と同じになる）可能性が考えられます。もしそうであれば、解決するためにはタイミングを計って実行するようにすればよいと思われます。でも、その前に・・・＞iframe0１.htmlでは同一table内で　a.gifを，iframe02ではb.gifを表示 iframe01.htmlとiframe02.htmlを別ファイルとして作成してあるのであれば、わざわざご質問のような手間を掛けずとも、ソースを書き分けておきさえすればスクリプトは一切不要になりそうな気がします。呼び出し側も通常のリンクですみませんか？　I 表示する対象を常に frame01.html にしておいて、実際の内容を引数で制御したいというのであれば、わからないでもないですが… という、仮定のもとに回答するならば、方法1：親html側でフレームのロードを監視する親のhtmlでiframeのonloadを待ってスクリプトを実行するようにしておけば、ロード後に実行されます。ただし、IE系ではキャッシュからロードされるとloadイベントが発生しないとかあったような気がしますので、statusをチェックするようにしないといけないかも。（確認していません）方法2：子側から親のパラメータを読みにいく子htmlのスクリプトをonloadで動くようにしておいて、子側から親へパラメータを取りにいくようにすればタイミングの問題も解決できます。親側にパラメータを返す関数を用意しておくか、パラメータをオブジェクトなどにして保管しておくかなど。方法3：uriのクエリ部を利用する（呼び出されるのは、同じhtmlファイルと仮定）タイミングを計ったり、異なるドキュメントでパラメータをやり取りする必要がないので、比較的簡単かと思います。親フレームからは、uriのlocation.search部分にパラメータを設定してiframeを呼び出すだけ。子フレームではlocation.searchを取得して、パラメータを受け取ると言う仕組み。方法4：サーバ側で処理をする方法サーバ側でphpなどが使えれば、方法3のリクエスト内容に応じたソースを出力するだけという方法。環境さえあるならば、この方法も確実で簡単と思われます。ご質問の通りで、設定が2種類しかないのであれば、現状のhtmlファイルのソースを書き分けておくのがスクリプトも要らなくなるので、一番堅実なような気がします。（スクリプト・オフのユーザ環境では当然ながらスクリプトは動作しません）

iframe内のスクリプトを親から3つ実行する記述

#1、2です。

#1です。

よくわかってませんけれど、

似たような質問が見つかりました

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング