- ベストアンサー
タブページの中にframeページを作成できますでしょう？
htmlとjavascriptについての質問です。 ページ遷移なしで表示内容を切り替えるために、タブによる表示内容の切り替えページを作成しております。 参考にしているサイトは、 http://nais.to/~yto/tools/css_tabs/ です。 タブの作成までは問題なく完成しました。 しかし、切り替わる表示内容の入力で重要な問題に気づきました。 それは、frameを用いたページを切り替えようとしていたことです。 <body>の下にタブの切替があり、そして、そのタブの中に<frame>を使っていることになります。 通常、frameを使用するときはbodyを使えない（frameがbodyの代わりになる）ことになっているので、エラーが出て、frameを使った内容が表示されなくなってしまいました。 タブによるframeを使ったページを切り替える方法がありましたら、どなたかお教え頂けないでしょうか？ インラインフレームの中にframeを使ったページを入れての切替はできるのですが、それだとインラインフレーム内でページ遷移してしまい都合が悪いのです。 お手数ですが、どなたかよろしくお願い致します。
- yamaps
- お礼率88% (15/17)
- JavaScript
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
＞それだとインラインフレーム内でページ遷移してしまい・・・ 多分、location.hrefの切り替えで表示しているのですよね？ 試してないけど、表示にはiframeを利用して、サンプルのdivと同様にiframeの表示/非表示だけを制御してあげれば、再読込みはおきないので問題にはならないのでは？ （最初に、それぞれのフレームに各htmlを読込んでおく） 最初の読込み時間は、当然、しかたがないとしていいんですよね？
その他の回答 (1)
- yyr446
- ベストアンサー率65% (870/1330)
ご参考のタブメニューの仕組みでは、どう考えても無理そうです。 その仕組みは、javascriptで<div>ブロックのスタイル属性を、 表示・非表示制御して実現しているものだから。おっしゃるように <frame set>をおけません。iframeを使って <div id="box2"> <iframe src="fuga.htm"></iframe> </div>にすれば、出来ますが 理由がよくわかりませんが？iframeは、いやなのですね。 となると、frameページのトップページからフレーム対応した タブメニューを使わざるをえないでしょう。（おそらく） frameページでタブによってページを切り替える方法は↓にありました。 http://technique.eweb-design.com/0906_tbf.html
補足
>yyr446様 御回答ありがとうございます。 ご提案された方法は思いつきませんでした。 しかし、この方法だと、タブをクリックする毎にサーバーを読んでしまいまして、iframeを避けた理由もそこにあるのです。 例えば、 タブ１に住所などの入力フォーム、 タブ２は入力のヘルプページ、 とします。 iframeなどの方法だと、タブ１での入力の最中に、タブ２を開き、またタブ１に戻ったときに入力途中の内容が消えてしまいます。 質問の際に参考にしているサイトの方法では、一度アクセスすれば、全てクライアントサイドで行えるので、採用していたのです。 参考サイトですが、なぜかリンクが化けてしまっていました。 http://nais.to/~yto/tools/css_tabs/ ↑が正しいURLです。
お礼
>fujillin様 入力フォームの質問に引き続き、御回答ありがとうございます。 iframeの表示/非表示の切替‥ ありがとうございます。 仰るとおり、この方法だと再読込は起きそうにないですね。 もちろん最初の読込は問題ございません。 ありがとうございました。