ＡＳＰでタブのように見せる方法

解決済

質問者：gorou
質問日時：2003/04/16 22:26
回答数：2件

環境：ＡＳＰ(VBScript)　
このgooのベージの一番上にあるタブのようなものを
押すと表示ベージの内容が変わるようにするにはどうしたらいいのでしょうか？
（ただ単にページを切り替えているだけにも見えるが
それだとわかります。違うＡＳＰファイルを呼び出せばいいわけなので。同じＡＳＰファイル内だけで同じようなことはできないのですか？）
簡単なサンプルがあればわかるのですが。
よろしくお願いします。

通報する

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

質問の本文を隠す

回答 (2件)

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

No.2ベストアンサー

回答者： BlueRay
回答日時：2003/04/17 13:39

サンプルです。

コピペして動作を確認して見てください。
後は、御自分の思うように改造してください。

準備するファイル
index.asp
a.asp
b.asp
c.asp

'index.asp ******************************
<HTML>
<HEAD></HEAD>
<BODY>
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="0" WIDTH="100%" HEIGHT="100%">
<TR VALIGN="top"><TD HEIGHT="1">
<TABLE ALIGN="left" BORDERCOLOR="#000000" BORDER="1" CELLSPACING="0" CELLPADDING="0">
<TR>
<TD ALIGN="center" WIDTH="50" ONCLICK="location.href='index.asp?pg=1'" STYLE="cursor:hand">ページＡ</TD>
<TD ALIGN="center" WIDTH="50" ONCLICK="location.href='index.asp?pg=2'" STYLE="cursor:hand">ページＢ</TD>
<TD ALIGN="center" WIDTH="50" ONCLICK="location.href='index.asp?pg=3'" STYLE="cursor:hand">ページＣ</TD>
</TR>
</TABLE>
</TD></TR>
<TR><TD>
<TABLE BORDER="1" WIDTH="100%" HEIGHT="100%">
<TR VALIGN="middle"><TD ALIGN="center">
<%
Select Case Request.Querystring("pg")
Case "1"
Response.Write "<IFRAME WIDTH='100%' HEIGHT='100%' SRC='a.asp'></IFRAME>"
Case "2"
Response.Write "<IFRAME WIDTH='100%' HEIGHT='100%' SRC='b.asp'></IFRAME>"
Case "3"
Response.Write "<IFRAME WIDTH='100%' HEIGHT='100%' SRC='c.asp'></IFRAME>"
Case Else
Response.Write "ここに、選択されたタブのページを表示します。"
End Select
%>
</TD></TR>
</TABLE>
</TD></TR>
</TABLE>
</BODY>
</HTML>

'a.asp ******************************
ページＡ

'b.asp ******************************
ページＢ

'c.asp ******************************
ページＣ

- 1
- 件

通報する

この回答へのお礼

ありがとうございます。
大変参考になりました。

通報する

お礼日時：2003/04/17 16:23

No.1

回答者： noname#102878
回答日時：2003/04/17 04:16

察しのとおり、単純にやるならばそれぞれのページでそれぞれの描画をするだけです。

ただしこれだと芸がないですよね。
そこで、ASPとなるわけですが。

【構成】
default.asp、A.asp、B.asp、C.aspとあったとします。
トップページのdefault.aspからA.asp、b.asp、c.aspへ移動するような構成だとします。

【解説】
各ページの<head>内にD.incファイルをインクルードするための記述をします。
「」って感じで。
このD.incファイルにはVBScriptの関数を記述します。
この関数は「どのタブを目立たせるか」という引数を受け取って、適切なタブを描画するためのHTMLコードを出力します。
この関数を「Function GenHeadTab( index )」とでもしましょうか。

各aspファイルでタブを表示させたい部分に
Default.aspなら「<% = GenHeadTab( 0 ) %>」
A.aspなら「<% = GenHeadTab( 1 ) %>」
B.aspなら「<% = GenHeadTab( 2 ) %>」
C.aspなら「<% = GenHeadTab( 3 ) %>」
というように、それぞれのページからこの関数を呼び出す際の引数を変えてあげます。

D.incファイルのGenHeadTab関数内では、引数で得た番号で条件判断をして、「目立つタブ」を適切に変更するHTMLのコードを出力してあげます。
ここで言うHTMLコードってのは、<html>～</html>のことではなくて、タブの部分のみのHTMLです。
tableを使うのが一般的かな。
判断には「Select Case」を使えば簡単ですよね。

【とどのつまり】
4つのASPページから呼び出される共通の独自関数を別ファイルにしてしまおう、ってことです。
インクルードファイルに共通関数や共通処理を書くっていうのは非常に有効なテクニックです。
データベースへ接続するための処理や接続を解除する処理なんてのは沢山のページから呼び出したいものです。