WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:同じリンクテキストから次々と

0:[投稿] RAUM [MAIL] [2002/12/06 01:32 ][環境:WIN+IE わからない]

こんばんわ。
初めて質問させていただきます。

インラインフレームを使ってページを表示させたいのですが、親ページに「NEXT」と書いてインラインフレームに表示させるページを「NEXT」をクリックするたびにページ送りするように変更できないかと考えています。

はたして、このようなことは出来るのでしょうか?
やり方があるのでしたらご教授ください。
よろしくお願いいたします。


1:[回答] 平野 敬 [MAIL] [URL] [2002/12/06 09:46 ]

JavaScriptで操作してはいかがでしょう。

---
<!DOCTYPE HTML PUBLIC
    "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html lang="ja">

<head>
    <title>iFrameテスト</title>
    <script type="text/javascript"><!--
        var i=0;
        function viewNextPage(){
            document.frame1.location.href = i+'.html';
            i++;
        }
    //--></script>
</head>

<body>

<h1>iFrameテスト</h1>

<iframe name="frame1" width="50%" hight="50%">
    <p>インラインフレーム表示枠</p>
</iframe>

<form action=".">
    <p>
        <input
            type="button"
            onClick="viewNextPage()"
            onKeyPress="viewNextPage()"
            value="Next[N]"
            accesskey="N">
    </p>
</form>

</body>

</html>
---

ただしこの場合、表示したいページを "0.html", "1.html", "2.html"... のように名づけておく必要があります。また、JavaScriptやインラインフレーム非対応環境への代替情報も必要でしょう。


2:[回答] ちゃいぱ [2002/12/06 10:15 ]

私も、ちょっとやってみました。
ご参考になれば、幸いです。

<head>
<title>TEST</title>
<script type="text/javascript">
<!--
var index=0;
var tbl_link = new Array("http://members.jcom.home.ne.jp/w3c/omake/diary.html","http://www.parkcity.ne.jp/~chaichan/src/shikan6.htm");
function next(){
   if(index < tbl_link.length){
      document.getElementById('b').src=tbl_link[index];
      index++;
   }
   else{
     alert("END");
   }
}
//-->
</script>
</head>
<body>
<p><a href="#" onClick="next()">NEXT</a></p>  
<iframe id="b" src="http://www.parkcity.ne.jp/~chaichan/" width="100%" hight="50%">
代替情報をどうぞ。
</iframe>
</body>


3:[完了] RAUM [MAIL] [2002/12/07 02:40 ]

こんばんわ。
平野さん、ちゃいばさん、どうもありがとうございます。

 お二人の書いてくださった内容をhtmlファイルにして、試してみました。
クリックするたびにページが切り替わりますね。

 一応今書いている自分のページに組み込んでみましたが、記述の内容がまだ理解できていないので、アレンジはまだ無理みたいです。
 ですが、JavaScriptでこんなことが可能なことが分かりましたので、興味がわきました。いろいろ調べえて勉強したいと思います。
 また分からないことがありましたら質問させていただきますのでよろしくお願いいたします。

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World