ホームページ作成ガイド

カーソルを自動移動させる

<html><head><title>カーソルを自動移動させる</title>
<SCRIPT Language="JavaScript">

</SCRIPT>
</head>
<body>
<form>
郵便番号：<br>
<input type="text" name="zip1" size="3" maxlength="3" onKeyUp="cursorNext(this, 'zip2', 3)">
-
<input type="text" name="zip2" size="4" maxlength="4" onKeyUp="cursorNext(this, 'send', 4)">

<input type="submit" name="send" value="送信">
</form>
</body></html>

入力フォームに指定文字数を入力すると、次の入力フォームにカーソルが移動します。
ユーザーは、マウスでクリックしたり、Tabキーを押したりといった手間がなくなります。

<head></head>内に上記JavaScriptを記述します。

<input>に「onKeyUp=」を記述します。
onKeyUp="cursorNext(this, 'zip2', 3)"
次に移動させたい入力フォームのnameの値↑ ↑入力文字数

という意味です。