• ベストアンサー

順番号をつけたhtmlファイルのページ推移

順番号をつけたhtmlファイルへページ推移させたいんですが、現在のファイルの番号を取得して次ページ(++)と前ページ(--)へ数値を代入する方法がわかりません。また、最小値と最大数に達したときにindex.htmlに移動するようにしたいです。 未熟な上、書いてみましたが、動きやしません… [次ページへ] <SCRIPT LANGUAGE="JavaScript"> function.next;{ document.links[sample(i).html]; for (i=0; i<最大値; i++); } </SCRIPT> <a href="javascript:next">次へ</a> [前ページへ] <SCRIPT LANGUAGE="JavaScript"> function.next;{ document.links[sample(i).html]; for (i=0; i>0; i--); } <a href="javascript:back">戻る</a> </SCRIPT> 「もし、最大値と最小値に達したとき、index.htmlに移動する」 はわかりませんでした。 ご教授いただければ幸いです。

質問者が選んだベストアンサー

  • ベストアンサー
  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.1

現在の、ファイル名は、 location.pathnameで 取り出せます。 ファイル名から数字の部分を取り出すには、 例えば、ファイル名が sample01.html とかだったら parseInt("sample1.html".substr(6)) 見たいな感じで数字部分を取り出せます。 次のページの処理では if(数値<最大値){ 数値=数値+1; location.href="sample"+数値+".html"; } else { location.href="index.html"; } みたいな感じでやればいいと思います。 前ページも同様

punats
質問者

お礼

ご回答ありがとうございます。 ご回答を頂いて、早速やってみたのですが、 やはりどうにもわかりません。 もうちょっと試行錯誤してみます。

その他の回答 (4)

  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.5

>私の持っている本には「substr(n,m);」と例題にありn番目からm個の文字を抜き出す:となっています その通りですが、m(取り出す長さ)が省略された場合、 n番目から終端(文字列の最後まで)を取り出すということになっているので、サンプルでは省略しています。 その意味で substr(7)とsubstr(7,1) は、同じではありません。 後者は一文字を取り出します。 前者は、残り一文字の場合は同じになりますが、もっと長い文字列の場合同じにはなりません。

punats
質問者

お礼

ご回答ありがとうございます。 なるほど…最後まで取り出すことになると省略できるのですね。 浅はかでしたね…奥が深いですね。

  • m035
  • ベストアンサー率44% (38/86)
回答No.4

>「もし、最大値と最小値に達したとき、index.htmlに移動する」 maxが最大連番で取得した現在のページ番号はnだとします。 var max=10; //ここまでにnは+-(前進後退)されたとします。 if(n<0||n>max){ location.href="index.html"; }

punats
質問者

お礼

ご回答ありがとうございます。 >  n<0||n>max 「nが0より小さいとき/nがmaxより大きいとき」2つの条件のうちどちらかを満たしたとき、index.htmlに移動する。 ははぁ~ん、ふむふむ、文章の通りですね。 「||」は便利ですね。これ使わせていただきます。

回答No.3

まず、BLUEPIXYさんが言われているようにlocation.pathnameからファイル名を取得、ファイル名の中から対象の数字部分を抜き出す部分をがんばりましょう。 サイト上であればパスの区切り文字は基本的に"/"のはずなので、split()関数を使うと、案外簡単にファイル名自体は取って来れます。 そこからは「何文字目からが数字で、末尾何文字は数字以外の拡張子部分で」というのを考えてsubstringなどで数字部分を抜き出します。 後はボタンやリンクのクリック時に「↑で抜き出した数字が最大/最小か?」をif文で・・・というようになります。 基本的にはBLUEPIXYさんが言われているやり方を文章で説明しただけですけどね。 あえて今回はヒントになる関数のみにしておきました。 出来ればここからは、ネット検索とBLUEPIXYさんの言われているようにalert()で内容を見てがんばって欲しいですが、どうしてもサンプル的なものが必要であればまた言ってください。

punats
質問者

お礼

アドバイスありがとうございます。 なんとかalert()でがんばってみます。 ここでくじけたらいつまでたってもおなじなので。 ただ、やり方に絶対の方法がないだけにわかりにくいところがありますねぇ…

  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.2

>試行錯誤 とりあえず、 alertしまくる var file=location.pathname; alert(file); alert(file.substr(7)); var num=parseInt(file.substr(7)); alert(num); var nextfile="sample"+num+".html"; alert(nextfile); がんばれ^^/~

punats
質問者

お礼

ご回答ありがとうございます。 alert();をはさんで確認するんですね!なるほど!度々すいません。 >var num=parseInt(file.substr(7));の「7」は7番目からという意味ですよね? 私の持っている本には「substr(n,m);」と例題にありn番目からm個の文字を抜き出す:となっていますが、上記はsubstr(7))とsubstr(7,1))は同じ結果を示すのですが、解釈として同じと認識してもいいのですか? 頂いたアドバイスで近いとこまではきてました。

関連するQ&A

  • javascriptによる動的なリンクの変更

    javascriptによって、ラジオボタンをチェックする度に(チェックを変える度に) 動的にリンクを変更したいのですが、上手くいきません。 すみませんが、どなたか教えていただけないでしょうか? ちなみに、下記は私が試したコードです。(全く動きませんが。) ラジオボタンのチェックを変えると、<a>タグのhrefの中身のURLが、そのボタンのvalueに対応して変わるようにしたいのですが。。 <FORM NAME="sample"> 選択して下さい -->  <input type="radio" name="list" OnChange="UpdateLink()" value="http://www.yahoo.co.jp" />s <input type="radio" name="list" OnChange="UpdateLink()" value="http://www.vector.co.jp/authors/VA011407/" />m <input type="radio" name="list" OnChange="UpdateLink()" value="mailto:akirayu@a2.mbn.or.jp" />l <A href="samplelink">リンク更新!!</A> </FORM> <SCRIPT LANGUAGE="JavaScript"> <!-- var pos; for(var i=0; i < document.links.length; i++) { if (document.links[i].href.indexOf("samplelink") != -1) pos = i; } function UpdateLink() { checked = document.sample.list.checked Index; document.links[pos].href = document.sample.list[checked ].value; } //--> </SCRIPT>

  • javascript をhtmlページで使用する方法を教えてください。

    <form name=\"addr\"> リンク先-> <select name=\"list\" onChange=\"chg_url()\"> <option value=\"http://www.yahoo.co.jp\">yahoo1</option> <option value=\"http://www.yahoo.co.jp\">yahoo2</option> <option value=\"http://www.yahoo.co.jp\">yahoo3</option> </select> <a href=\"Dest\" target=_blank> リンク </a> </form> <script language=\"javascript\"> <!-- pos = 5555; for(num=0;num<document.links.length;num++) { if (document.links[num].href.indexOf(\"Dest\") != -1) { pos = num; num = 5000; } } function chg_url() { if (pos!=5555) { sel = document.addr.list.selectedIndex; document.links[pos].href = document.addr.list[sel].value; } } chg_url(); //--> </script> のスクリプトを同じページに何個も利用したいのですが、どうしたらうまくいきますか? 同じページにこのスクリプトを設置すると、全部同じページにリンクしてしまいます。java初心者なので、ぜひ教えてください。お願いします。 あと、「java」の質問回答の方に間違えて載せてしまいました。すみませんでした(>_<)

  • 外部ファイルにした時の引数

    今、外部ファイルとして作っていて、疑問になったことがあります。 HTMLファイルから何か引数(番号など)を渡して、それによって動作を変えられないかというものです。perlみたいに・・・ ↓こんな感じで実現できたら、とても便利なんですが、何か良い方法はないでしょうか? ★HTMLファイルでも呼び方 <script language="JavaScript" src="menu.js?menuno=4"></script> ★Javascriptファイル内での判定 if(document.menuno.value=="4"){ document.write("<a href='next/index.html'></a>"); } else { document.write("<a href='other/index.html'></a>"); }

  • 別なページにジャンプさせたい

    ボタンをクリックすると指定のページに飛ぶようにしたいのですが、 <html> <head> <script language="JavaScript"> function jump(){ location.href="index.html"; } </script> </head> <body> <form onSubmit="jump()"> <input type="submit"> </form> </body> </html> でも <html> <head> <script language="JavaScript"> function jump(){ location.href="index.html"; } </script> </head> <body> <form> <input type="submit" onClick="jump()"> </form> </body> </html> でも動きません。(そのページを表示したままです) <body onload="jump()">にしたときは正常にジャンプできるので、クリックのイベントが拾えていないと思うのですが、どのように記述すればいいのでしょうか。 よろしくお願いいたします。

  • リンク一覧の表示

    <SCRIPT language="JavaScript"> <!-- function ShowLinks(){ var msg = "リンクの一覧:<BR>"; for(i=0; i < document.links.length; i++){ msg = msg + "<A href=" + document.links[i] + ">" + document.links[i] + "</A><BR>"; } var new1 = window.open('','new1', 'toolbar=1, location=1, status=1, menubar=1, scrollbars=yes, resizable=1, width=650, height=800'); new1.document.write(msg); new1.document.close(); } //--> </SCRIPT> 下記のように表示されるのを リンクの一覧: http://***.ne.jp/bbns.cgi http://***.ne.jp/abc.cgi 下記のように番号を付けて表示したいのですが リンクの一覧: 0:http://***.ne.jp/bbns.cgi 1:http://***.ne.jp/abc.cgi

  • テキストのリンクをON/OFFする

    Javascriptでテキストをクリックすると2箇所の画像を同時に変更することができたのですが、表示されている画像のテキストのリンクをはずす方法がわかりません。はじめは「ページ3+4」のテキストのみがクリッカブルで、「ページ3+4」のテキストをクリックすると、「ページ1+2」のテキストのみがクリッカブルになるようにしたいのです。表示されていない画像のテキストのみをクリッカブルにする方法をどなたか教えていただけますでしょうか? <script language="JavaScript"> <!-- function swapImg(imgfile1,imgfile2) { document.swpimg1.src = imgfile1; document.swpimg2.src = imgfile2; } // --> </script> <div><img src="sample1.gif" name="swpimg1" /><img src="sample2.gif" name="swpimg2" /></div> <div><a href="javascript:swapImg('sample1.gif','sample2.gif')">ページ1+2</a> <a href="javascript:swapImg('sample3.gif','sample4.gif')">ページ3+4</a></div>

  • 1つのファイルで画像をクリックしたら差し代わる方法

    表題のようにJavascriptで1つのhtmlファイルで複数の箇所に違う画像があり、それをクリックしたら別の画像に差し代わるということをしたいのですが、中々うまくいかずに困ってしまっています。 下記のようなソースになった場合にそれぞれ別の画像でクリックしたら違う画像に差し替えるには関数等の書き方はどのようにすれば宜しいのでしょうか。 どなたか教えてもらえますでしょうか? Javascript初心者にて失礼しますm(_ _)m 下記に途中までやったソースがあるのですが、行き詰ってしまってます。。。。。 宜しくお願い致します。m(_ _)m m(_ _)m ・・・・・・・・・・・・・ JavaScriptは下記の通りです。 //1つ目の画像に関係するJavaScriptです <script language="JavaScript"> num = 2; nme = "image/index"; exp = "jpg"; cnt = 0; function changeImage() { cnt++; cnt %= num; document.index.src = nme + cnt + "." + exp; } </script> //2つ目の画像に関係するJavaScriptです <script language="JavaScript"> num = 2; nme = "image/img"; exp = "jpg"; cnt = 0; function changeImg() { cnt++; cnt %= num; document.img.src = nme + cnt + "." + exp; } </script> htmlは下記の通りです。 <!--1つ目の画像です--> <a href="JavaScript:changeImage()"> <img src="image/index0.jpg" name="index" border="0"></a> <!--2つ目の画像です--> <a href="JavaScript:changeImg()"> <img src="image/img0.jpg" name="img" border="0"></a>

  • ファイルサイズの取得について

    初めてのJavaScriptです、宜しくお願いします。 フレームページで左ページから右ページのファイルサイズを調べる事はできますか? <script type="text/javascript"> function getSize(){ document.write(parent.rightFrame.document.fileSize); } </script> </head> <body><!-- leftFrame --> <p><a href="http://www.yahoo.co.jp" target="rightFrame">ヤフー</a></p> <p><a href="javaScript:getSize()">サイズ</a></p> </body>

  • ページ履歴を残すには?

    こんにちは。 1→2→3→4→5にページ履歴を残すようなスクリプトを作りたいと思い、いろんなサイトを見ていると、下記のようなスクリプトを見つけたのですが、 <head内> historyDelimiter = " → "; function addHistory(item) { var h = []; if(document.cookie != "") h = document.cookie.split(historyDelimiter); h.push("<a href=\"" + document.URL + "\">" + item + "</a>"); document.cookie = h.join(historyDelimiter); } function showHistory() { document.write(document.cookie); } <body内> <script type="text/javascript"> <!-- addHistory("1ページ"); showHistory(); //--> </script> これでやると、Windows XP IE6でしか表現されませんでした。 しかも履歴がどんどんと伸びていきます。 例えば、1→2→3→4→5まで行き2をクリックすと1→2みたいには出来ないのでしょうか? それとMacのFirefoxでの使用も多々ありますので、こちらでも表現できないものでしょうか? cgiやphpなどのプログラムが使用できないためjavascriptでやろうと思っているのですが、javascriptではなく他になにかいい手段はないでしょうか? ちなみにhtmlのページ数も400ページほどありますが、手作業で1ページずつ打っていったほうが無難でしょうか。

  • #を利用した時に、ページの上に戻らないようにするには?

    初めまして。 <a href="#">にリンク先を設定するとページの真ん中でもページの上に自動的に戻ってしまいます。JavaScriptを利用するときにとても不便なので、上に戻らないようにしたいです。 ソースは、 <head> <script language = "JavaScript"> <!-- function sound(name){ document.all.music.src = name; } --> </script> </head> <body> <div style="margin: 5px -6px;"> <a href = # onclick = sound('効果音ファイル')> <img src="画像" alt="" border="0"> </a> </div> <body> なにか解決する方法がありましたら一言お願いします。

専門家に質問してみよう