[操作・移動]ブラウザの「戻る」ボタンと同様の効果をJavaScriptで作るには、historyオブジェクトのbackメソッドを使って、history.back();と記述するだけです。これで「直前のページに戻る」リンクが簡単に作れます。履歴が存在しない場合にはリンクそのものを生成しないようにするには、history.lengthプロパティを参照して判別する方法も(不完全ですが)なくはありません。閲覧履歴が存在する場合にだけ、戻るリンクを表示する?history.lengthで履歴の個数は分かる直前のページに戻るリンクをJavaScriptで作る方法JavaScriptを使うと、ブラウザの「戻る」ボタンや「進む」ボタンをクリックした場合と同じ効果を提供できます。これを活用することで、「前のページに戻る」リンクを作ることができます。JavaScriptを使って、ブラウザの履歴を1つ戻す(=直前のページに戻る)には、以下のように記述します。);historyオブジェクトはブラウザの閲覧履歴を保持しています。backメソッドで「戻る」ボタンと同じ効果を出せます。goメソッドに引数「-1」(マイナス1)を与えても同じです。「2つ前のページに戻す」のような需要は滅多にないとは思いますが、引数に「-2」を与えれば2つ前のページに戻れます。(^_^;)ちなみに引数に「0」を与えると、現在のページを再読込します。これを使って、「直前のページに戻る」リンクやボタンを作るには、以下のようにHTML&JavaScriptを書けばよいでしょう。false;」と書いているのは、履歴が存在しなかった場合に(a要素の本来の動作である)リンク機能を無効にするためです。これがないと、履歴が存在しなかった場合にページの先頭にスクロールしてしまいますので。上記のソースを表示させると、以下のように見えます。ボタン:リンク:直前のページに戻る新しいウインドウやタブでページが表示されている場合や、ブックマークからアクセスした場合は、「直前のページ」は存在しません。その場合は、ページ移動は起こりません。この場合も、閲覧履歴に先がない場合はページ移動は起こりません。閲覧履歴が存在する場合にだけ、戻るリンクを表示する?履歴が存在しない場合はこのリンクは機能しないので、その場合でもリンクが表示されているのは都合が悪いかも知れません。アクセス者からすれば、「機能しないリンクがある」ということになるわけですから。いったプロパティが存在していました。現在ではセキュリティのためか廃止されていて使えません。これらのプロパティが使えたら、値を参照することで「戻れるかどうか」の判別ができたのですが。(FirefoxではVer.26で廃止されたようです。)history.lengthで履歴の個数は分かるで、直接どこのURLなのかは分からないものの、historyオブジェクトのlengthプロパティを参照すれば、現在のセッションで保持されている「履歴の個数」は分かります。履歴の個数を先に調べておいてから、1つ以上ある場合にのみ「戻る」リンクを表示するようにすれば「戻れる場合にだけ戻るリンクを表示する」ということも実現可能っぽく感じられます。この履歴の個数は「戻る方向」への履歴だとは限りません。「戻る方向」の履歴はゼロだけど「進む方向」の履歴は存在する......という可能性もあります。したがって、lengthプロパティで履歴の個数をチェックしても「戻れるかどうか」の正確な判別はできません。その辺に目をつぶるのであれば、以下のようなJavaScriptで「履歴がある場合にのみ戻るリンクを表示する」ということも可能です。{document.write('履歴がないよ');}history.lengthには「現在のページ」もカウントされるので、値は必ず1以上になります。上記のように「history.lengthの値が2以上かどうか」をチェックすれば、履歴が存在するかどうかをチェックできます。先にも述べたとおり、「進む方向」の履歴かも知れないので、判別機能としては不完全ですが。ブラウザの閲覧履歴には「ページ内リンク」をクリックした場合も追加されるので、「前のページ」が「同一ページ内の別の場所」である可能性もあります。上記のJavaScriptソースを表示すると、以下のように見えます。このページのURLをコピーして、新規のタブなりウインドウなりを開いてからアドレス欄にペーストすることで表示すれば、「履歴がないよ」と表示されるでしょう。(^_^;)まあ、「進む」や「戻る」機能はブラウザに搭載されている機能を使えば良いので、あまりウェブ上にそういう機能を作る必要性はないかな、とも思いますけどもね。コーヒーをおごる著者紹介にしし(西村文宏)にししでございます。本書いたり記事書いたりしてます。著書5冊発売中です(Web製作系4冊+小説1冊)。本の最新刊は2011年3月に発売されたライトノベルでございますよ。Aboutでウェブ作成系の記事を連載しています。2001年からの累計記事数は400本を超えています。電子書籍を書きました。Unlimitedにも対応。(紙の本)5冊の著書があります。➡著書一覧と詳細これまでに、下記の書籍を上梓致しました。逃走少女と契約しました。製作依頼について●製作のご依頼は:ウェブページ全般の製作依頼だけでなく、特定の機能を提供するJavaScript単体の作成作業も含め、各種の製作依頼を承っております。お気軽にお問い合わせ下さい。モダンスタイルによる基礎から現場での応用まで▲JavaScriptの文法仕様を基礎からしっかり把握したい場合にお勧めです。解説がとても詳しく、基礎から応用まで網羅されていて、JavaScriptを隅々まで理解するのに役立ちます。JavaScriptを詳しく知るには、とりあえずこれを1冊読みましょう。▲JavaScriptのライブラリやフレームワークが、ひたすら多数紹介されています。目的に応じてどんなライブラリを使えば良いのか、そもそもどんなライブラリがあるのか知るのにお勧めです。▲正確な文法を知りたいとき、手軽にさっと調べられる辞書(辞典)として手許に置いておきたい場合に。▲jQueryを活用する方法について、サンプルと実現ソースが見やすく列挙された解説書。基礎から分かりやすく説明されています。▲jQueryを活用して実現できる様々なパーツ(デザインやUI)の実装方法を列挙した解説書。サンプルが多数あります。JavaScriptの基礎知識とUIデザインの実装方法などを解説したムックです。......と言っても初心者向けでは決してないので注意してね。^^;JavaScriptに関する解説書は、自分に合うかどうか立ち読みして確認したり、せめて購入前に目次などから大まかな内容はチェックしておいた方が良いと思います。TIPSふぁくとりーの主要なカテゴリ下記のカテゴリに区分して、JavaScriptに関するTIPSを公開しています。カッコ内の数字は、該当する記事の件数です。(16)著者紹介にしし(西村文宏)にししでございます。本書いたり記事書いたりしてます。著書5冊発売中です(Web製作系4冊+小説1冊)。本の最新刊は2011年3月に発売されたライトノベルでございますよ。関連するかもしれない情報など▼このページに関連しそうな記事が約8本くらい自動表示されています。INFORMATIONSこのページの製作者は、にしし(西村文宏)です。このページの内容は真実であることが基本ですが、虚構や妄想が混じっていることも多々あります。(^_^;)リンクは歓迎致します。リンク用バナーも用意しています。必要であればご使用下さい。このサイトについてこのページは、スマートフォン・タブレット等のモバイル端末でもご覧頂けます。URLは端末に関係なく共通です。※このサイトは横幅768px未満で閲覧するとモバイル用、横幅768px以上で閲覧するとタブレット&PC用デザインになります。横幅920px以上での閲覧がお勧めです。古いブラウザ(特にIE7以下など)では横幅に関係なくレガシーデザインになります。