Enterキーの操作

質問

JavaScriptで、パスワード入力用のテキストボックスとログインする為のボタンを作りました。
パスワードを入力して、ログインボタンを押せば、パスワードを確認し、合っていれば別のページを表示するというものなのですが、ログインボタンではうまくいくのですが、パスワードを入力したあと、Enterキーを押してしまうと、IEのアドレス欄に『?TB_pw=123&C_pw=y』というような感じで入力したパスワードが出てきてしまいます。
Enterキーを押したときの操作はどのように設定すればよいのでしょうか？

回答No.4

leaz024

テキストボックス内でのEnterキーで送信されてしまうのは、ブラウザの仕様です。
また、その際に自分自身に送信するため、URLに『?TB_pw=123&C_pw=y』が出てきてしまうというのも、Mizyuさんの言う通りです。

これらは、通常次のようにします。
１．Enterキーへの対処について
　Enterキーの動作を無効にすることは難しいので、パスワードチェックを送信時に行います。
これは、FORMタグの onSubmit で myPw() を呼び出すことで行えます。（これによって、Enterキーを押しても myPw() が実行されます。）
　また、ログインボタンも type="submit" にすることで、onClick がなくてもチェックできるようになります。

２．『?TB_pw=123&C_pw=y』を表示しない方法について
　確かに、FORMタグの action にHTML名を書いて、method="POST" とすれば表示されなくなるはずですが、サーバによってはPOST送信だと拒否される場合があります。
なので、最初に行っていたように、location.href にURLを指定する方がよいでしょう。
　このとき、FORMの送信動作をキャンセルしないとならないため、onSubmit では常に false を返すようにします。

３．パスワードについて
　JavaScriptにパスワードが書いてあるので、見ようと思えば誰にでもパスワードが見られてしまいます。（外部ファイルに置いても、暗号化しても、所詮は見られてしまいます。）
　なので、JavaScriptのみでパスワードを掛けたい場合は、次のページ（top.htm）のファイル名をパスワードにすると良いでしょう。

これらをまとめると、次ようになります。
<FORM onSubmit="return myPw(this)">
<P>パスワード：
<INPUT type="password" size="30" name="TB_pw">
<INPUT type="submit" value="ログイン"><BR><BR>
<INPUT type="checkbox" name="C_pw" value="y" checked>このパスワードを保存する。
</P>
</FORM>

function myPw(f) {
　　location.href = f.TB_pw.value + ".htm";
　　return false;
}

パスワードが違う時は「ページが見つかりません」というエラーになります。（alertはできませんが、簡単にパスワードがばれてしまうよりは良いでしょう。）
パスワードを変えたいときは、top.htm のファイル名を 新パスワード.htm にするだけです。

補足

ありがとうございました。大変参考になりました。
ちなみに、下の方に書かれた、次のページのファイル名をパスワードにするという方法で、そのパスワードをクッキーか何かを使って、次回から入力せずに済む方法はありますか？