ミスチルの大名曲の数々が配信決定!! 31日間無料!!

PHPで作成している画面について、テキストコントロールにフォーカスがある場合に、
Enterキーを押下することで、submitが行われることを無効化させたいと思っています。
<SCRIPT LANGUAGE=javascript>
<!--
document.onkeypress = enter;
function enter(){
if( window.event.keyCode == 13 ){
return false;
}
}
//-->
</SCRIPT>
のようなJavaScriptを記述すれば完全にEnterキーを無効にできるようですが、
この状態だと、submitにフォーカスがある状態でEnterキーを押下してもsubmitが実行されません。
この状態を解決する方法をご存知の方、アドバイスをお願いします!!

ちなみにブラウザは最低でも、IE6,7とFireFoxには対応したいと思っています。

当方、HTML,PHP,JavaScriptは素人同然ですので、明確な内容で教えて頂けると助かります。
宜しくお願いします!!

このQ&Aに関連する最新のQ&A

A 回答 (3件)

すみません、気になったのちょっと横槍を失礼……


「テキストコントロールのときだけ」無効ならば以下ですね。

<html>
<head>
<title>テキストがアクティブのときだけエンターきかない</title>
</head>
<body>
<form id="form1" name="form1" action="http://localhost/">
テキストA:<input type="text" name="arrowhead"><BR>
チェック:<input type="checkbox" name="delta"><BR>
テキストB:<input type="text" name="ladylove"><BR>
ラジオ:<input type="radio" name="wavemaster"><BR>
セレクト:<select name="morningglory">
<option>セレクト
</select><BR>
<input type="submit" value="サブミット"><BR>
</form>
</body>
<script type="text/javascript">
<!--
//@cc_on
document./*@if(1) attachEvent( 'on' + @else@*/ addEventListener( /*@end@*/ 'keypress', function( evt ) {
 var target = evt./*@if(1) srcElement @else@*/ target /*@end@*/;
 var keyCode = evt./*@if(1) keyCode @else@*/ which /*@end@*/;
 if( /text/i.test( target.type ) && keyCode == 13 ) {
  /*@if(1) evt.returnValue = false; @else@*/ evt.preventDefault( ); /*@end@*/
 }
}, false );
//-->
</script>
</html>

違う部分を探せば分かると思いますが、今後の学習などの参考になればと思い投稿いたしました。
    • good
    • 0
この回答へのお礼

細かい回答ありがとうございました!
無事対応できました!

お礼日時:2009/05/23 17:20

よこやりによこやり。


いとしないときに、まちがって えんた~をたたくと
とんでしまうよ~。なので・・・。ばぶ。
    • good
    • 0

<script type="text/javascript">


<!--
//@cc_on
document./*@if(1) attachEvent( 'on' + @else@*/ addEventListener( /*@end@*/ 'keypress', function( evt ) {
 var target = evt./*@if(1) srcElement @else@*/ target /*@end@*/;
 var keyCode = evt./*@if(1) keyCode @else@*/ which /*@end@*/;
 
 if( !/submit/i.test( target.type ) && keyCode == 13 ) {
  /*@if(1) evt.returnValue = false; @else@*/ evt.preventDefault( ); /*@end@*/
 }
}, false );
//-->
</script>
    • good
    • 0
この回答へのお礼

ありがとうございました!
無事対応できました!!

お礼日時:2009/05/23 17:19

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

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

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

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

window.name = (new Date()).getTime();   


function make_newwin(f) {
  f.target = window.name + "_ko";
  var w = window.open("about:blank", f.target, "スタイル設定");
  w.focus();
}
//-->
</script>
</head>
<body>
<form name="test" action="/cgi-bin/test-check.cgi" method="post" onSubmit="make_newwin(this)">
<input type="submit">
</form>
</body>
</html>

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

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

window.name = (new Date()).getTime();   


function make_newwin(f) {
  f.target = window.name + "_ko";
  var w = window.open("about:blank...続きを読む

Aベストアンサー

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">
<!--
window.name = (new Date()).getTime();

function make_newwin(f) {
  f.target = window.name + "_ko";
  var w = window.open("about:blank", f.target, "スタイル設定");
  w.focus();
  f.submit();
}
//-->
</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())も行っています。

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

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

FORM による送信動作は onSubmit により無効化されていますので(このため、submitボタンでも送信できません...続きを読む

Qエンターキーを押したときに関数を呼び出す方法

エンターキーを押したときに関数を呼び出すにはどのようにプログラムを記述すればよいのですか?

Aベストアンサー

大抵の言語ではキーが押されたかというハンドラがありそのオブジェクトとして何のキーが押されたかの情報があります。
javascriptでもonKeyPressハンドラのオブジェクトwindow.event.keyCodeの内容を見てエンターキー(値は13)だけ処理をするという形にすれば云いと思います。
即席で作ったサンプルですが参考にして下さい。

<html>
<head>
<title>sample</title>
<script language="JavaScript">
<!--
function Key_on(key)
{
if(key == 13){
alert("ENTERが押されました");
}else{
alert("ENTER以外が押されました");
}
}
-->
</script>
</head>
<body onKeyPress="Key_on(window.event.keyCode)">
何かキーを押して下さい
</body>
</html>

Qjavascriptでセレクトボックスの"selected"を動的につ

javascriptでセレクトボックスの"selected"を動的につける方法について質問させてください。

現在、以下のようなフォームを作成しました。

<select name='year'>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
</select>月

<select name='day'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
<option value='13'>13</option>
<option value='14'>14</option>
<option value='15'>15</option>
<option value='16'>16</option>
<option value='17'>17</option>
<option value='18'>18</option>
<option value='19'>19</option>
<option value='20'>20</option>
<option value='21'>21</option>
<option value='22'>22</option>
<option value='23'>23</option>
<option value='24'>24</option>
<option value='25'>25</option>
<option value='26'>26</option>
<option value='27'>27</option>
<option value='28'>28</option>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日


このセレクトボックスに、例えば今日の日付"2010年9月30日"だったら、それぞれの年、月、日の<option>に"selected"をつけたいのですが、javascriptではどのようにして実現したら良いのでしょうか?

よろしくお願いします。

javascriptでセレクトボックスの"selected"を動的につける方法について質問させてください。

現在、以下のようなフォームを作成しました。

<select name='year'>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8...続きを読む

Aベストアンサー

こんな感じで・・・

<script>
window.onload=function(){
var f=document.getElementById("f0");
var ymd=new Date();
checkSelect(f.elements["year"],ymd.getFullYear());
checkSelect(f.elements["month"],ymd.getMonth() +1);
checkSelect(f.elements["day"],ymd.getDate());
}
function checkSelect(obj,val){
for(var i=0;i<obj.length;i++){
if(obj[i].value==val){
obj[i].selected=true;
break;
}
}
}
</script>
<form id="f0">
<div>
<select name='year'>
<option value='2009'>2009</option>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
</select>月

<select name='day'>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日
</div>
</form>

こんな感じで・・・

<script>
window.onload=function(){
var f=document.getElementById("f0");
var ymd=new Date();
checkSelect(f.elements["year"],ymd.getFullYear());
checkSelect(f.elements["month"],ymd.getMonth() +1);
checkSelect(f.elements["day"],ymd.getDate());
}
function checkSelect(obj,val){
for(var i=0;i<obj.length;i++){
if(obj[i].value==val){
obj[i].selected=true;
break;
}
}
}
</script>
<form id="f0">
<div>
<select name='year'>
<opt...続きを読む

Qテキストボックスに数字しか入力できないようにするには?

タイトルの通りなのですが、あるテキストボックスに数字しか入力できないようにしたいのですが可能でしょうか?また、

「あいうえお 12345 「」:・、¥・」

というような文字列をコピーし、そのテキストボックスにペーストした際にも数字の12345だけが残るといった事も実現したいのですが…

どなたかご存知の方いらっしゃいましたら教えて頂けると幸いです。

Aベストアンサー

>英数字

では、こんな感じで

<input type="text" onKeyup="this.value=this.value.replace(/[^0-9a-z]+/i,'')">

Q[Javascript]エンターキー押下でTABキーコード送出!

こんにちは。

エンターキーで複数のテキストフィールドを移動するというような質問は多く出ていまして、私もそれを参考に画面を作っています。

今回私が悩んでいますのが、エンターキーの押下でTABキーと同じ動きをさせたいのです。
理由はいろいろありまして、そのうちの1つがTABINDEXを有効にしたいという点です。

これはエンターキーとTABに限ったことではなく、例えば「A」の入力で画面には「B」と表示するとか・・・。色々使い方はあると思いますが。

是非とも宜しくお願い致します。

Aベストアンサー

bodyのonkeyDownイベントで以下の関数(javascript)を呼んでみて下さい。
keycodeを13(Enter)から9(Tab)に変換するものです。
ちなみに以下のFunctionではイベント発生元がボタンかsubmitだった場合コード変換しません。

function ChgKeyCode()
{
if (!(event.srcElement.type == "button" || event.srcElement.type == "submit"))
{
if (event.keyCode == 13)
{
event.keyCode = 9;
}
}
}

>これはエンターキーとTABに限ったことではなく、例えば「A」の入力で画面には「B」と表示するとか・・・。色々使い方はあると思いますが。

同じ様にしてキーコードを変換してやれば可能ですよ。

QconfirmのOK・キャンセルを押した後の操作制御

いつもお世話になっています。

<script language="JavaScript">
<!--
function startConfirm(){
confirm("本当によろしいですか?");
}
// -->
</script>
</head>

(中略)

<form action="next.asp" target="_top" name="me">
<td>
<input TYPE="submit" value="全削除" name="all_del" onclick="startConfirm()">
</td>
</form>

と、このようなボタンを押したときに確認メッセージを表示させています。
キャンセルを押した場合にnext.aspに遷移せず、自分の画面に戻る
または他の画面に遷移させたいのです。

startConfirm()の中に処理を書けば良いのでしょうが、哀しいかな、わかりません(涙)。
やり方をご存知の方、教えてください。

alertでOKを押された時の処理を任意に行う方法も教えていただけたら嬉しいです。

いつもお世話になっています。

<script language="JavaScript">
<!--
function startConfirm(){
confirm("本当によろしいですか?");
}
// -->
</script>
</head>

(中略)

<form action="next.asp" target="_top" name="me">
<td>
<input TYPE="submit" value="全削除" name="all_del" onclick="startConfirm()">
</td>
</form>

と、このようなボタンを押したときに確認メッセージを表示させています。
キャンセルを押した場合にnext.aspに遷移せず、自分の画面に戻る
または他の画面に遷...続きを読む

Aベストアンサー

こんにちはさん、xruzです。
submitボタンにこだわらずscriptでsubmit()すれば柔軟に対応できますよ。
こんな感じではいけませんか?

<html>
<head>
<title>submit</title>
</head>
<script language="javascript">
<!--
function frmSubmit() {
var errFlag=true;
// チェックとか処理とかをします
if(errFlag==false) {
// alert("Err"); // エラー処理かな
return;
}
if(confirm("Send Ok?")) {
// document.frm.target="main"; // 表示先の変更
// document.frm.action="hoge.asp"; // リンク先の変更
document.frm.submit();
} else {
// this.location.href="jump.cgi"; // キャンセルした場合のリンク先?
}
}
//-->
</script>
<body>

<form method="post" action="" name="frm" target="_self">

<input type="button" value="send" onclick="frmSubmit();">
</form>

</body>
</html>

がんばってくださいね。

こんにちはさん、xruzです。
submitボタンにこだわらずscriptでsubmit()すれば柔軟に対応できますよ。
こんな感じではいけませんか?

<html>
<head>
<title>submit</title>
</head>
<script language="javascript">
<!--
function frmSubmit() {
var errFlag=true;
// チェックとか処理とかをします
if(errFlag==false) {
// alert("Err"); // エラー処理かな
return;
}
if(confirm("Send Ok?")) {
// document.frm.target="main"; // 表示先の変更
// document.frm.action="hoge....続きを読む

QJSPの処理の途中で、JavaScriptの処理をしたい

プログラムをJSPで記述している(<% %>タグ)のですが、
JavaScriptのalertやconfirmなどのポップアップするダイアログを
表示したいのです。それは可能なのでしょうか?

Aベストアンサー

No.2の回答に対する回答(変な日本語ですが)です。

JSPとJavaScriptの処理の行われる順番について考えていないと
エラーになることがありますよ。
大まかな流れは、
 JSPのソースをサーバ側で解釈、実行する(HTMLのソースを吐き出す)
  ↓
 クライアントに生成したソースを送信する
  ↓
 クライアント側のブラウザがソースを解釈する
  ↓
 ソースの中のJavaScriptを、ソースの上のほうから順次実行する
  ↓
 同時に、通常の表示(HTMLの解釈)も実行される

 と、こういう流れですので、例えば、JavaScriptで値を入力し、
JSPでその値を使おうとすると、エラーとなります。

 具体的にやりたいこと(やろうとしていること)を書いていただいたほうが
適切に回答できますが、上記が今考えられるエラーの原因です。

Qテキストボックス入力を半角英数字に制限する

よろしくお願いします。

テキストボックスに入力される文字を、
半角英数字(英語の場合は大文字のみ)以外入力できないように制限したいのですが可能でしょうか?

もしくは半角英数字以外が入力された場合アラートを出すようにしたいのですが。。。

また、文字数の制限も可能でしょうか?

第一希望)
12文字以内の半角英数大文字以外入力できないように入力制限する。

第二希望)
12文字以内の半角英数大文字以外入力の文字が入力されている状況でボタン(=CGI実行)を押すと警告のアラートが出る。

第三希望)
半角英数大文字以外入力できないように制限、もしくはアラート表示。

例)
AAAA-1234567 ○(ハイフンを含め12文字以内の半角英数字)
AAAA-123456789 ×(12文字以内でない)
aaaa-1234567 ×(小文字が含まれている)


webサーバー・・・HP-UX
web・・・IE6
開発端末・・・windows2000(Tera Term 使用)

情報をお持ちの方いらっしゃいましたら、
よろしくお願いいたします。

よろしくお願いします。

テキストボックスに入力される文字を、
半角英数字(英語の場合は大文字のみ)以外入力できないように制限したいのですが可能でしょうか?

もしくは半角英数字以外が入力された場合アラートを出すようにしたいのですが。。。

また、文字数の制限も可能でしょうか?

第一希望)
12文字以内の半角英数大文字以外入力できないように入力制限する。

第二希望)
12文字以内の半角英数大文字以外入力の文字が入力されている状況でボタン(=CGI実行)を押すと警告のアラートが...続きを読む

Aベストアンサー

第二希望の条件について。
前提としてチェックするテキストボックスのnameがtxtであった場合の説明をします。
まず、次のようにform開始タグにname="fm"とonsubmit="return checkForm()"を追加します。

<form name="fm" action="********.cgi" method="post" onsubmit="return checkForm()">


次に以下を<head>~</head>に貼り付けることで、JavaScriptによる送信前のチェックが可能です。

---------------------------------------
<script type="text/javascript">
<!--
function checkForm(){
var str = document.fm.txt.value;
if (str.match(/[^A-Z\d\-]/)) {
alert("半角英数字(大文字)しか入力できません");
return false;
}
else if (str.length > 12) {
alert("12文字以内で入力してください");
return false;
}
}
//-->
</script>
---------------------------------------

「ハイフンを含め」と書いているので、ハイフンを入れても有効なようにしました。
また、12文字以内としか書かれていないので0文字でも警告が出ないようになっています。
もし、何も入力されていない場合でも警告を出すならば、次のようにしてください。

---------------------------------------
if (!str) {
alert("何も入力されていません");
return false;
}
else if (str.match(/[^A-Z\d\-]/)) {
alert("半角英数字(大文字)しか入力できません");
return false;
}
else if (str.length > 12) {
alert("12文字以内で入力してください");
return false;
}
---------------------------------------

第二希望の条件について。
前提としてチェックするテキストボックスのnameがtxtであった場合の説明をします。
まず、次のようにform開始タグにname="fm"とonsubmit="return checkForm()"を追加します。

<form name="fm" action="********.cgi" method="post" onsubmit="return checkForm()">


次に以下を<head>~</head>に貼り付けることで、JavaScriptによる送信前のチェックが可能です。

---------------------------------------
<script type="text/javascript">
<!--
function checkForm(){
...続きを読む

Q配列をPOSTで受けとる

タイトルのまんまですが
配列をformで送って
それをPOSTで受け取りたいのですが
うまくいきません

具体的に言うと
<?php
print"<form method=POST action=action.php>";

for($i=0; $i<$n; $i++){
   print"<input type=text name=foo[$i]>";
}
print"<input type=hidden name=n value=$n>";
print"<input type=submit value=go>";
print"<form>";
?>


///////////以下action.php//////////////////
<?php
$n = $_POST["n"];
for($j=0; $j<$n; $j++){
   $foo[$j] = $_POST["foo[$j]"];
   print"$foo[$j]";
}
?>


こんな感じのことがしたいのですが
うまくいきません
どうもPOSTされてないみたいでfoo[$j]はnullです
凡ミスな気がしなくもないんですが...プログラム初心者なんで↓↓
教えてください
よろしくお願いします

タイトルのまんまですが
配列をformで送って
それをPOSTで受け取りたいのですが
うまくいきません

具体的に言うと
<?php
print"<form method=POST action=action.php>";

for($i=0; $i<$n; $i++){
   print"<input type=text name=foo[$i]>";
}
print"<input type=hidden name=n value=$n>";
print"<input type=submit value=go>";
print"<form>";
?>


///////////以下action.php//////////////////
<?php
$n = $_POST["n"];
for($j=0; $j<$n; $j++){
   $foo[$j] = $_POST["foo[$j...続きを読む

Aベストアンサー

atsuGTさんこんにちは。


受け取り側は

$foo = $_POST["foo"];

とするだけで$fooに送信された配列が格納されます。


$_POST["foo[添え字]"] ではなく、
$_POST["foo"][添え字] となります。

QonClickに複数の関数を挿入する方法

初心者なのですがアニメーションの関数anime1、anime2、anime3を作成し、onClickに下記のように設定しました。
クリックするとアニメーション2つの設定ではは動くのですが、3つ目を設定すると動かなくなります。
通常はこのような設定はしないものなのでしょうか?
教えてください。
よろしくお願いします。
<INPUT type="button" value="START" onClick="anime1(), anime2()">・・・OKです。
<INPUT type="button" value="START" onClick="anime1(), anime2(),anime3()">・・・動きません。

Aベストアンサー

セミコロンでつなぐのが常道ですが、3つ以上なら
別途function化したほうが、可読性が高くなると
思います。


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング