2-1 パスワードを入力して別のページにジャンプ

家族や友人など特定の人にしか見せたくないプライベートなページを作成しましょう。
正しいパスワードをいれないとアクセス出来ないようにします。
プライベートなページ に相当するページは好きなURLで構いません。
（以下の実行例では secret.html としています。）

ファイル名は js2-1.html  としてください。

実行例

※ パスワードは hoge です。

サンプル

このサンプルは不完全です。 <省略> の部分は適宜補いましょう。

 ： 省略

1: <script language="JavaScript">
2: <!--
3:
4: function passCheck(){
5:    Input = window.prompt("<省略>","");
6:    if ( Input == "<省略>" ){ <省略> } else { alert( "<省略>" ); }
8: }
9:
10: // -->
11: </script>
12:
13:
14: <form>
15: <input type="button" value="秘密ページにアクセス！" onclick="passCheck()">
16: </form>

  ： 省略

解説

おおまかな流れ

ページ上にボタン（<input type="button">）を作り、クリックされたら
window.prompt() を使ってパスワード入力欄を表示。
パスワードが正しければ、別のページにジャンプさせます。

別のページにジャンプするには

Javascriptを使うと、現在のページから指定のページに強制的に移動させることができます。
そのためには location.href="URL"; を使います。
移動先のページを URL で指定してください。
自身のサイト内の別のファイルであれば URL はファイル名でも構いません。
(例)
location.href="http://www.yahoo.co.jp";
location.href="secret.html";

Javascriptは この location.href が実行されると直ちにページを移動させます。
ページの閲覧者は突然画面が切り替わったように見えます。

プログラム本体の解説

4行目：
function passCheck(){
新しい関数 passCheck() を作成しています。
この関数は、ページ上に作成されたボタンがクリックされた時に呼び出され、パスワードチェックと別ページへのジャンプを処理します。

5行目：
Input = window.prompt("<省略>","");
入力フォームのあるウィンドウを、window.prompt() を使って開いています。
＜省略＞ の部分には 「パスワードを入力してください」 などの好きなメッセージを記入して下さい。
閲覧者が入力したパスワードは Input 変数に格納されます。

6行目：
if ( Input == "<省略>" ){ <省略> } else { alert( "<省略>" ); }
入力されたパスワードが正しいパスワードと一致しているかを判定して、 別ページにジャンプ または、
alert() を使ってパスワードが違う旨のメッセージを表示しています。
一番左の ＜省略＞ の部分には、好きなパスワードを記入してください。
それが正しいパスワードとなります。