ENTERキーを無効にしたいのですが教えて下さい

解決済

質問者：sara555
質問日時：2004/09/27 16:54
回答数：5件

ENTERキーを無効にしたいのですが、SUBMITボタンでjavascriptを動かしています。
SUBMITを押した瞬間に、別ウィンドウにデータを渡しているのですが、
どの部分にどのようなスクリプトを追加すれば良いでしょうか？
良かったら教えて下さい。

■親ウィンドウのHTML
<html>
<head>
<title>親</title>
<script type="text/javascript">

</script>
</head>
<body>
<form name="test" action="/cgi-bin/test-check.cgi" method="post" onSubmit="make_newwin(this)">
<input type="submit">
</form>
</body>
</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (5件)

ベストアンサー優先
最新から表示
回答順に表示

No.5ベストアンサー

回答者： leaz024
回答日時：2004/09/30 13:03

No.3、4 で回答されているキーの押下を無効化する方法では、フォーム内に TEXTAREA があった場合に、その中で改行することもできなってしまいます。

ですので、No.2で回答されているように、FORM の onSubmit で false を return するのが定法です。

ただし No.2 の回答では、make_newwin() によって新しいウィンドウは開いたものの、肝心の「送信」を行っていないので、うまく行かなかったのです。

FORM による送信動作は onSubmit により無効化されていますので（このため、submitボタンでも送信できません）、FORMオブジェクトの submit() メソッドを使って自分で送信する必要があります。

以下サンプル
<html>
<head>
<title>親</title>
<script type="text/javascript">

</script>
</head>
<body>
<form action="/cgi-bin/test-check.cgi" method="post" onSubmit="return false">
<input type="button" value="送信" onClick="make_newwin(this.form)">
</form>
</body>
</html>

※submitボタンは無効なので type="button" の汎用ボタンを使い、その onClick で make_newwin() を呼び出します。
※make_newwin() のパラメータはフォームオブジェクトでなければならないので、this.form を渡します。
※make_newwin() の中で、ついでに送信（f.submit()）も行っています。

- 0
- 件

通報する

この回答へのお礼

leaz024さん、またまた回答していただき、
有難うございます。教えていただいた方法で、
無事解決しました。
w.focus();の後に、f.submit();で送信すれば、
良かったのですね。とても勉強になりました。
実はフォーム内に TEXTAREA を作成していて、
どうしようかと思っていました。
本当に有難うございました。

通報する

お礼日時：2004/09/30 13:21

No.4

回答者： caitsith_goo
回答日時：2004/09/30 12:31

<html>

<head>
<script language="JavaScript">

</script>
</head>
<body>
<form name="" method="post" action="" onkeydown="keyBreak()" onsubmit="make_newwin(this)">
：
<input type="submit">
</form>
</body>
</html>
これはどうでしょうか。

- 0
- 件

通報する

この回答へのお礼

回答有難うございます。
このような方法もあるのですね。
プログラムまで書いていただいて、
本当に有難うございました。
今回は、テキストエリアがあったため
使う事ができませんでしたが、
わかりやすい説明で、理解できました。
本当に有難うございました。

通報する

お礼日時：2004/09/30 13:23

No.3

回答者： caitsith_goo
回答日時：2004/09/29 17:03

ENTERを押したときはSUBMITしないで、SUBMITボタンを押したときだけSUBMIT以下の処理を行うということでいいのでしょうか。

<form name="" method="post" action="" onkeydown="keyBreak()">

とformタグに入れて、ファンクションを以下のようにします。

function keyBreak(){
if(window.event.keyCode=="13"){
event.returnValue = false;
}
}

このようにすれば、
そのフォーム内でSUBMIT以前のENTERキーを押した時にfalseとなり、ENTERキーのみを効かないようにできます。
SUBMITをクリックすれば普通に作動します。

ただWINのIEでしか動かなかったような気がします。（未確認です）

この回答への補足

回答有難うございます。
やはり、白い画面になり、FORMの値を別ウィンドウに
渡せません。

function make_newwin(f) {
　　f.target = window.name + "_ko";
　　var w = window.open("about:blank", f.target, "スタイル設定");
　　w.focus();
}

:

<form name="" method="post" action="" onsubmit="make_newwin(this)">

:

<input type="submit">

でしたら、きちんと別ウィンドウにわたせます。
教えていただいた方法で、下記のように
してみました。

function keyBreak(){
　if(window.event.keyCode=="13"){
　event.returnValue = false;
　}
}

<form name="" method="post" action="" onkeydown="keyBreak()">

：

<input type="button" value="登録" onclick="make_newwin(this.form)">

としてみましたが、うまくいきません。
白い画面になります。

make_newwin(f)は、SUBMITを押した時に、
動作したいのです。

make_newwin(f)と教えていただいたkeyBreak()
を組み合わせれば、何とかする方法はありますか？

良かったら教えて下さい。

補足日時：2004/09/30 09:07

通報する

- 0
- 件

通報する

No.2

回答者： nuki
回答日時：2004/09/27 20:48

HTML+JavaScriptでENTERキーを無効にするための

条件は、onsubmitイベントハンドラの実行結果が
falseであることです。
ですので、onsubmit="return false"とすれば良い
ことになります。

ということで、以下の様にソースを修正されては
いかがでしょうか?

(修正前)
<form name="test" action="/cgi-bin/test-check.cgi" method="post" onSubmit="make_newwin(this)">
<input type="submit">

(修正後)
<form name="test" action="/cgi-bin/test-check.cgi" method="post" onSubmit="return false">
<input type="button" value="SUBMIT" onclick="make_newwin(this.form)">

申し訳ないのですが、動作確認はしておりませんので
試行錯誤してみて下さい。
JavaScriptだけにブラウザ依存で動く動かないなどが
発生する場合もありますので。

この回答への補足

回答有難うございます。教えていただいた方法で作成してみたのですが、
about:blankで、白い別ウィンドウは表示されるのですが、
targetでフォームの値を渡せません。
下記の動作を言わば行っているのですが、ENTERキーを無効で
この作業を行いたいのです。よかったら、教えて下さい。

このような場合は、まず window.open で別窓を作り、そのウィンドウ宛にフォームを送信する、という方法が有効です。（下記参照）

・FORMタグを次のように変更します。

<FORM action="/cgi-bin/test.cgi" method="post" target="newwin" onSubmit="make_newwin(this)">

・make_newwin 関数を作成します。

function make_newwin(f) {
　　var w = window.open('about:blank', f.target, 'スタイル設定');
　　w.focus();
}

フォームを送信しようとすると FORM の onSubmit により、make_newwin が（送信前に）実行されます。この時、引数に this（FORM自身）を渡し、window.open の２番目の引数（target指定）に f.target（FORMのtarget属性値）を指定するのがミソです。

その後フォームの送信が行われますが、この時既に newwin という（スタイル指定された）ウィンドウが存在していますので、そちらに送信される、というわけです。