ロゴ
HOME > HTML > フォームで数字のみを入力させたい

フォームで数字のみを入力させたい

サンプル

 フォーム入力チェックが出来るvalidationライブラリを設定していれば入力を数値に制限する事が出来ますが、必須にはせず入力だけを数値に制限したいケースが割と有ります。

フォーム

<input name="text" type="text" value="" onkeydown="return key_down(event.keyCode)" style="ime-mode: disabled;">

js

  function key_down(get_code){
     if(
          get_code >= 48 && get_code <= 57  //数字キー
       || get_code >= 96 && get_code <= 105 //テンキーの数字
       || get_code == 8 //bs
     )
       return true;
     else
       return false;
  }

仕組みは単純で、キーダウンしたときのキーコードが数字キー、テンキーなら入力するという感じ。消せないと厄介なのでBSキーもOKとしています。あと、ime-modeで半角入力に制限出来ますので、念のため設定しておくと良いと思います。