htmlとjavascriptについての質問です。ページ遷移なしで表示内容を切り替えるために、タブによる表示内容の切り替えページを作成しております。参考にしているサイトは、 http://nais.to/~yto/tools/css_tabs/ です。タブの作成までは問題なく完成しました。しかし、切り替わる表示内容の入力で重要な問題に気づきました。それは、frameを用いたページを切り替えようとしていたことです。の下にタブの切替があり、そして、そのタブの中にを使っていることになります。通常、frameを使用するときはbodyを使えない（frameがbodyの代わりになる）ことになっているので、エラーが出て、frameを使った内容が表示されなくなってしまいました。タブによるframeを使ったページを切り替える方法がありましたら、どなたかお教え頂けないでしょうか？インラインフレームの中にframeを使ったページを入れての切替はできるのですが、それだとインラインフレーム内でページ遷移してしまい都合が悪いのです。お手数ですが、どなたかよろしくお願い致します。

タブページの中にframeページを作成できますでしょう？

解決済

質問者：yamaps
質問日時：2009/01/15 14:45
回答数：2件

htmlとjavascriptについての質問です。

ページ遷移なしで表示内容を切り替えるために、タブによる表示内容の切り替えページを作成しております。

参考にしているサイトは、
http://nais.to/~yto/tools/css_tabs/
です。

タブの作成までは問題なく完成しました。
しかし、切り替わる表示内容の入力で重要な問題に気づきました。
それは、frameを用いたページを切り替えようとしていたことです。

<body>の下にタブの切替があり、そして、そのタブの中に<frame>を使っていることになります。

通常、frameを使用するときはbodyを使えない（frameがbodyの代わりになる）ことになっているので、エラーが出て、frameを使った内容が表示されなくなってしまいました。

タブによるframeを使ったページを切り替える方法がありましたら、どなたかお教え頂けないでしょうか？

インラインフレームの中にframeを使ったページを入れての切替はできるのですが、それだとインラインフレーム内でページ遷移してしまい都合が悪いのです。

お手数ですが、どなたかよろしくお願い致します。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： fujillin
回答日時：2009/01/15 18:06

＞それだとインラインフレーム内でページ遷移してしまい・・・

多分、location.hrefの切り替えで表示しているのですよね？

試してないけど、表示にはiframeを利用して、サンプルのdivと同様にiframeの表示/非表示だけを制御してあげれば、再読込みはおきないので問題にはならないのでは？
（最初に、それぞれのフレームに各htmlを読込んでおく）
最初の読込み時間は、当然、しかたがないとしていいんですよね？

- 0
- 件

通報する

この回答へのお礼

>fujillin様

入力フォームの質問に引き続き、御回答ありがとうございます。

iframeの表示/非表示の切替‥
ありがとうございます。

仰るとおり、この方法だと再読込は起きそうにないですね。
もちろん最初の読込は問題ございません。

ありがとうございました。

通報する

お礼日時：2009/01/16 14:33

No.1

回答者： yyr446
回答日時：2009/01/15 16:04

ご参考のタブメニューの仕組みでは、どう考えても無理そうです。

その仕組みは、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です。