戻れないページを作る
今回は、ブラウザの「戻るボタン」 を押しても戻ることができないようにしてみたいと思います。 この機能は検索エンジンなどで望まないページにアクセスされた時に、 強制的にTOPページへジャンプさせたりする時に使います。
今のページに戻れなくするには、ブラウザの履歴にURLを登録させないようにします。 Aタグやlocation.hrefを使うと現在のページが履歴に残るので、 location.replace()というものを使います。
location.replace()でリンクさせる
では、location.replace()を使ってリンクボタンを作ってみましょう。 HTMLのbody内に以下のように記入してみましょう。
<script>
function goTop(){
location.replace("http://pori2.net/");
}
</script>
<form>
<input type="button" value="サンプル" onclick="goTop()">
</form>
上記のサンプルボタンを押すと、うちのサイトのTOPページへ移動します。 そこでブラウザの戻るボタンを押しても、このページに戻ることができません。 確認して下さい。戻れなくなりますが(汗)
location.replace()の場合は、後ろの括弧内にジャンプ先を記入します。 location.hrefは「=」で指定しますが、方法が違うので注意しましょう (私もよく間違えます)。
- location.replace(URL)
- 履歴を残さずに、カッコ内に指定したURLに移動します
ページの強制移動
では検索エンジンで下層ページに来た場合に、 TOPへ強制移動させる方法について掲載してみます。
この場合はまずどこからリンクしてきたかを調べて、 URLに「search」という文字が含まれているとTOPページに強制移動させます。 戻るボタンを押されても履歴にURLは登録されていないので、 ジャンプ元のページではなくその前の検索結果ページに戻ります。
強制移動するページのbody内の一番上に、次のように書いておきます。
<script> //変数strに、直前のページURLを入れる var str = document.referrer; //str内に「search」という文字列があるか調べる var sflg = str.indexOf( "search" , 0 ); //search文字列がある場合に強制移動 if ( sflg != -1 ) location.replace( "http://pori2.net/" ); </script>
では上から解説していきます。 まず直前のページのURLを調べるには、document.referrerを使います。 URLを変数strに代入しています。
- document.referrer
- 直前のページURLを取得します
次に、特定の文字が含まれているかどうか確かめるためindexOf()を使います。 調べたい文字列を前に書き、ピリオドで結んでindexOfを書きます。 カッコ内は最初に調べたい文字列を、 次に文字列の検索スタート位置を書きます。 スタート位置は通常0でOKです。
もしも検索文字列が見つかったなら、 変数sflgに文字列の位置(前から何番目の文字か)が入ります。 見つからない場合は-1が入ります。
- 文字列.indexOf( 検索文字列 , 検索スタート位置 )
- 文字を検索し、Hitすると何番目の文字かを取得します。
- 見つからない場合は-1を返します。
最後にif文で、sflgを調べます。 slfgが-1(searchと言う文字が見つからなかった場合)はそのまま、 見つかった場合はlocation.replace()で強制移動します。 移動先はご自身のサイトのTOPページURLにして下さい。
まあこのようにして強制移動させられますが、 大抵の場合はお客さんを逃がすことになります(汗)。 ということで、あまり多用しない方が良いでしょう。