HTML・JSPでHPを作っているのですが4つのテキストボックスがあるとします。そこには1文字しか入力できないようになっていて1文字入力すると自動的につぎのテキストボックスにカーソルを移動させたいのですがどうしたらいいのでしょう?

イメージ的にはTABキーを押した感じなのですがそのTABを押さなくても入力した瞬間に次のテキストボックスに入力できるようにしたいのです。

よろしくお願いします。

A 回答 (2件)

こんな感じでどうでしょうか?



<html>
<head>
<title>入力時フォーカス移動</title>
<script language="JavaScript">
<!--
function moveFocus(name,to){
if(document.all[name].value.length == 1){
document.all["Txt_Input"+to].focus();
}
}
// -->
</script>
</head>
<body>
<form name="form1">
<input type="text" name="Txt_Input1" maxlength="1" onKeyUp="moveFocus(this.name,'2')">
<input type="text" name="Txt_Input2" maxlength="1" onKeyUp="moveFocus(this.name,'3')">
<input type="text" name="Txt_Input3" maxlength="1" onKeyUp="moveFocus(this.name,'4')">
<input type="text" name="Txt_Input4" maxlength="1">
</form>
</body>
</html>
    • good
    • 0
この回答へのお礼

ありがとうございます。
出来ました!!

お礼日時:2003/09/29 13:27

フォームのフォーカスを指定するのは下のソースで行けるはずですので、お試しください。

あとは入力した事を判定する処理を入れれば可能だと思います。

-----------------------------------------------
<HTML>
<HEAD>
<TITLE>Focus_Sample</TITLE>
</HEAD>
<BODY>
<DIV ALIGN="center">
<H3>A2の入力フォームにカーソルを合わせます。</H1>
</DIV>
<P>
<FORM NAME="myFORM">
<INPUT TYPE="text" NAME="A1">
<INPUT TYPE="text" NAME="A2">
<INPUT TYPE="text" NAME="A3">
</FORM>
<SCRIPT Language="JavaScript">
<!--
document.myFORM.A2.focus();
// -->
</SCRIPT>
</BODY></HTML>

この回答への補足

ありがとうございます。
教えていただいたようにやってみたのですがうまく動きませんでした。
判断文がおかしいのでしょうか?
判断文は下記のようにないたのですが・・・

<SCRIPT Language="JavaScript">
<!--
document.test.data1.focus();
if(data1!=NULL){
document.test.data2.focus();
}
if(data2!=NULL){
document.test.data3.focus();
}
if(data3!=NULL){
document.test.data4.focus();
}
-->
</SCRIPT>

補足日時:2003/09/29 10:35
    • good
    • 0

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

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

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

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

Qポインターとカーソルは同じ意味?

よく使う用語で、「マウスポインター」と「マウスカーソル」という用語がありますが、これって基本的に同じような意味を指すのでしょうか?
この間、仲間内で話題になりましたが、よく説明できる人がいなくて、曖昧なままなのです。
私が思うのは、ポインターは矢印型、カーソルは縦に点滅する、文字を入力するしるしだと思ったのですが、本当のところ、どうなのでしょうか?詳しい方よろしくお願いします。

Aベストアンサー

基本的に同じだと思います。
矢印も含めて、文字入力で次に入力する位置がどこか、みたいな|や■みたいなものもすべてカーソル。
マウスがないような時代からもテキスト入力はあるのでその頃からの呼び名ではないでしょうか。
マウスで操作されることが多くなって、マウスの位置を示す「マウスのポイント」から「マウスポインタ」や「マウスカーソル」という言葉も使われるようになったと思われます。

Qテキストエリア内のカーソル位置に文字を入力する方法

複数のbuttonを使って、textarea内に順番に文字を入れていくことは出来ましたが、
途中に文字を挿入したいとき、カーソルを合わせてbuttonを押しても末尾に入力される為、
カーソルの位置に入力できるようにしたいのですが、方法(ソース)が判りましたら教えてください。

また、buttonを使って連続で入力した際、最後に入力された
文字のみ削除するbuttonの作り方も判れば教えてください。
お願いします。

ブラウザはIE8です。

Aベストアンサー

”カーソル” でけんさくしないで、”キャレット” でしらべてみれば?

Q英文ホームページの英単語にカーソルをあわせると、意味がポップアップ表示されるソフト

英文のホームページ上で英単語にカーソルをあわせると、単語の日本語の意味がポップアップで表示されるソフトを教えてください。

できれば、マイクロソフトのワード上でも、英単語にカーソルをあわせると、単語の日本語の意味がポップアップで表示されるソフトを希望します。

よろしくお願いします。

Aベストアンサー

ホームページに限定ですが、gogleツールバーをインストールすれば
英単語の上にマウスを乗せれば日本語が出てきます。
フリーソフトですので無料です。

参考URL:http://toolbar.google.com/T4/intl/ja/index_xp.html

Qプルダウン Or コンボボックスを選択したら、テキストボックスを入力不可にさせる方法 

フォーム制御として、JavaScriptを使用して、プルダウンよりある項目が選択されたと同時に、あるテキストボックスの入力を不可、またはmaxlengthを0にしたいのですが、思うように出来ません。
maxlengthをvalue等に変更させたら値は変更されたので、
関数としての動きは問題なさそうです。

どなたか、ご教授お願いいたします。

※現在下記のソースは、list番号を指定していません。

<script language="JavaScript">
<!--
function MM_jumpMenu(){
parent.document.form1.text1.maxlength=0;

}
//-->
</script>

<form name="form1" method="post" action="">
<select name="menu1" onChange="MM_jumpMenu()">
<option selected>unnamed1</option>
<option>unnamed2</option>
</select>
<input type="text" name="text1" maxlength="10">
</form>

フォーム制御として、JavaScriptを使用して、プルダウンよりある項目が選択されたと同時に、あるテキストボックスの入力を不可、またはmaxlengthを0にしたいのですが、思うように出来ません。
maxlengthをvalue等に変更させたら値は変更されたので、
関数としての動きは問題なさそうです。

どなたか、ご教授お願いいたします。

※現在下記のソースは、list番号を指定していません。

<script language="JavaScript">
<!--
function MM_jumpMenu(){
parent.document.form1.text1.maxlength=0;

}
/...続きを読む

Aベストアンサー

> parent.document.form1.text1.maxlength=0;

form1 は、親にあるのは間違っていないのですね。

で、入力負荷にするのなら disabled プロパティをいじりましょう。

parent.document.form1.text1.disabled = true;

Q英文のPDFファイルで、画面上で英単語にカーソルをあてると、ポップアップで意味が出るソフト

英文のPDFファイルで、PDFファイル画面上で英単語にカーソルをあてると、ポップアップ形式で単語の意味が出るソフトを教えて下さい。

Aベストアンサー

Babylon 2

Qテキストボックスの最後に自動的にカーソルをもっていきたい

こんなことは可能でしょうか?

テキストボックスには別のjavascriptを用いて入力しているため自動的に最後にカーソルがいかなくて困っています

Aベストアンサー

<script type="text/javascript">
<!--
window.onload=function(){
document.FORM1.TEXT1.value="自動入力文字列";
document.FORM1.TEXT1.focus();
document.FORM1.TEXT1.value +="";
};
//-->
</script>

<form name="FORM1">
<input name="TEXT1" type="text" value="" >
</form>

Q英辞郎第四版のカーソルを合わせるだけで単語の意味を表示する機能

英辞郎第四版を使っているのですが、
カーソルを合わせるだけで単語の意味が表示されるポップアップ機能
ができません。
原因や対策が分かる方がいましたら教えてください。
よろしくお願いします。

Aベストアンサー

ロボワードのことだと思います。
http://www.technocraft.co.jp/support/down.html
でも付属のCDにもインストーラーがついていると思います。
用の無いときにもポップアップするので、私は利用出来ませんでした。

Qテキストボックスに入力されている文字種類のチェックがしたい

urizakaです。
さて、テキストボックスに入力されている文字が、指定した文字の種類か
どうかを識別し、そうでなかった場合はエラーを返すという処理を考えて
いるのですが(たとえば、カタカナで入力するように指示している場所で
カタカナ以外の入力があった場合はエラーを返す)、何か良い方法って
ありますでしょうか?
 すみませんが、宜しくお願いします。

Aベストアンサー

先程の半角スペースの方、補足しておきました。
で、今回の方は以下のようになります。

カタカナだけかどうかのチェックというのは普通やらないですが、やろうとすればこうなります。

if(document.form.text.value.match(/[^アイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤユヨラリルレロワヲンガギグゲゴザジズゼゾダヂヅデドバビブベボパピプペポ]/)){
alert("全角カタカナのみ使用できます。")
}

Qワードでのマウスカーソルの形について

ワードで、文章を入力するところで、マウスをいろいろ動かしていると、Iの形のマウスカーソルの右横か、左横、下に 短い線と長い線の 長短長短の4本の線が表示されますが、どういう意味があるのでしょうか?
マウスカーソルのある場所によって右横、左横、下と場所が変わります。紙の右端の場合は左横となりマウスカーソルの場所と関係あるようですが、その意味と場所の関係を教えてください。
よろしくお願いします。

Aベストアンサー

クリック アンド タイプのことですね
[ツール]→[オプション]→[編集と日本語入力]タブに
ある[クリック アンド タイプ編集を行う]にチェック
が入っていると表示されるものです。

詳しくは以下のURL先を見て下されば、それぞれの
違いを理解出来ると思います。
http://www.jpita.or.jp/hpv3/ziten/mokutekibetu/hyou_69.html
http://hamachan.fun.cx/word/kuriku.html

○クリックアンドタイプのできる箇所

カーソルが点滅している行か、文書の末尾

○クリックアンドタイプが利用可能な条件

・クリックアンドタイプ機能がOffになっていない
・印刷レイアウト、Webレイアウト、閲覧レイアウト
(Word 2003)である
・文書が横書きである
・段組みが設定されていない
・箇条書きが設定されていない

Qブラウザ上のテキストボックスから数値を受け取って別のテキストボックスに計算結果を返す

超初心者です。
Cの勉強をしていたのですが、javascriptにも手を出してみました。
変数の考え方が違うせいか、理解が間違っているのか・・・

ブラウザ上でテキストボックスに数値を記入して、別なテキストボックスに計算結果を返すソースを考えていました。
以下のような感じです。

HTML
------------------------
<form>
林檎 100円 * <input type=text name=txt7>個 
<input type=button value="計算" onClick="func4(txt7)"><br>
合計金額は<input type=text name=txt8>円になります。
</form>
-------------------------
JS
------------------------
function func4(keisan){
document.form2.txt8.value=keisan*100;
}
------------------------
上記のように変数を使うとエラーになります。「NaN」が返ってきます。
変数を使用せずに、直接受け取る値を計算すれば出来たのですが・・・
ブラウザからなにかを入力させ、それを変数に代入した場合は数値(INT)型にはならないのでしょうか??
詳しい方、解説をお願いします・・・

超初心者です。
Cの勉強をしていたのですが、javascriptにも手を出してみました。
変数の考え方が違うせいか、理解が間違っているのか・・・

ブラウザ上でテキストボックスに数値を記入して、別なテキストボックスに計算結果を返すソースを考えていました。
以下のような感じです。

HTML
------------------------
<form>
林檎 100円 * <input type=text name=txt7>個 
<input type=button value="計算" onClick="func4(txt7)"><br>
合計金額は<input type=text name=txt8>円になります。
</form>...続きを読む

Aベストアンサー

> ~value="計算" onClick="func4(txt7)"
これだと、func4に"txt7"という変数(おそらく未定義)を渡すという
意味になります。以下のように記述してください。
onClick="func4(document.getElementsByName('txt7')[0]))"
あるいは"func4(document.form.txt7)"

> document.form2.txt8.value=keisan*100;
引数の keisan はテキストボックというオブジェクトなので、計算
できません。(数値じゃない!)
また、テキストボックスの中身は何でしょう?文字列ですね。
数字しか書いてなくても文字列です。だから 4 + 5 は "45"のように
文字連結になってしまいます。掲題のように乗算など不可能です。

先ず、中身を得るためvalueプロパティを参照しましょう。
また、これを数値化するためparseIntやparseFloatを使います。
document.form2.txt8.value=parseInt(keisan.value)*100; または
document.form2.txt8.value=parseFloat(keisan.value)*100;

> ~value="計算" onClick="func4(txt7)"
これだと、func4に"txt7"という変数(おそらく未定義)を渡すという
意味になります。以下のように記述してください。
onClick="func4(document.getElementsByName('txt7')[0]))"
あるいは"func4(document.form.txt7)"

> document.form2.txt8.value=keisan*100;
引数の keisan はテキストボックというオブジェクトなので、計算
できません。(数値じゃない!)
また、テキストボックスの中身は何でしょう?文字列ですね。
数字しか書いてなくても文字列です。...続きを読む


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

人気Q&Aランキング