

お世話になります。

Windows、VisualStudio2015のASP.NET(VisualBasic)、.NET Framework4.6、  
ローカルIIS、ブラウザはGoogleChrome、IE、で開発しています。

１つのページにtext（ASP.NETではTextBox、名称はtxtTest）を置き、  
半角数字のみ入力できるように、function(名称はnumOnly())を設定します。

HTMLのソースは以下の通りです。  
functionは、`<head><script></script></head>`  
に書いてあります。

* * *
[code]

    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title></title>
    <script>
    <!--
    // 半角数値のみを入力可能にする
    function numOnly() {
      m = String.fromCharCode(event.keyCode);
      if("0123456789\b\r".indexOf(m, 0) < 0) return false;
      return true;
    }
    //-->
    </script>
    </head>
    
    <body>
        <form id="form1" runat="server">
        <div>
            <asp:TextBox ID="txtTest" runat="server"></asp:TextBox>・・・※A
        </div>
        </form>
    </body>
    </html>
    
[/code]

* * *

また、プログラムにおいては、  
ページをロードする際に、  
次のコードを実行します。

* * *
[code]

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
            txtTest.Attributes.Add("onkeydown", "return numOnly()")
    End Sub
    
[/code]

* * *

また、ブラウザで実行しますと、上記の※Aの部分のソースは、  
以下のようになります。

* * *
[code]

    <input name="txtTest" type="text" id="txtTest" onkeydown="return numOnly()" />
    
[/code]

* * *

これにより、パソコンのキーボードの上の方に横に並んでいる数字キーで、  
半角数字のみ入力はできるようになったのですが、  
テンキーでの半角数字入力ができません。

これをできるようにしたいのですが、  
何か適切な方法がございましたら、  
ご教示いただけたら幸いです。

どうそよろしくお願いします。

（functionの参照元）  
<http://javascript.eweb-design.com/1205_no.html>

`<SCRIPT>`という（大文字）はASP.NETでは適切でないようで、小文字に。  
「language="JAVASCRIPT"」の個所もエラーになるため外してあります。


CC BY-SA 3.0
2017-01-14T02:29:36.217
31831
2017-01-14T14:41:59.410
2017-01-14T02:46:00.403
4236
20210
question
javascript html css visual-studio .net
HTMLのtextのonkeydownで半角数字のみ入力を指定したところテンキー入力が効かない。


参考にされているページでもテンキーでの入力ができません。  
これは、`onkeydown` 時に得られる`keyCode` がキーボード上部のものとテンキーとで違うからです。

`onkeydown`の代わりに`onkeypress`を使ってみて下さい。

参考：[キーコード一覧](http://www.programming-
magic.com/file/20080205232140/keycode_table.html)


CC BY-SA 3.0
2017-01-14T03:07:28.433
31832
2017-01-14T03:07:28.433
5044
31831
answer


半角数字のみ受け付けたいinputにしたい場合、keydownやkeypressのkeyCode見てはじくのはできるかもしれないですが、ブラウザや端末によって仕様が違いそうだし、コピペに対しては対応できないので現実的でない気がします。

入力された値 → 全角数字を半角数字に変換 → 半角数字以外を削除

みたいな値を変換するアプローチがいかがでしょうか？

[code]

    function digitsFilter (val){
      return val.replace(/[０-９]/g, function(s){ return String.fromCharCode(s.charCodeAt(0) - 0xFEE0); }).replace(/[^0-9]/g, "");
    }
[/code]

[code]

    <input type="text" onchange="this.value = digitsFilter(this.value)">
[/code]

setIntervalで値を変更するデモを追加

[code]

    function bindDigitsFilter(input){
      
      var intervalId = null;
      
      var filterValue = function(){
        if ( !/[^0-9]/.test(input.value) ) {
          return;
        }
        var len = input.value.length;
        var end = input.selectionEnd;
        input.value = input.value.replace(/[０-９]/g, function(s){ return String.fromCharCode(s.charCodeAt(0) - 0xFEE0); }).replace(/[^0-9]/g, "");
        input.selectionEnd = end - (len - input.value.length);
      };
      
      input.addEventListener('focus', function(){
        if ( !intervalId ) {
          intervalId = setInterval(filterValue, 100);
        }
      });
      
      input.addEventListener('blur', function(){
        filterValue();
        clearInterval(intervalId);
        intervalId = null;
      });
    
    }
    
    bindDigitsFilter(document.getElementById('input'));
[/code]

[code]

    <input type="text" id="input">
[/code]


CC BY-SA 3.0
2017-01-14T10:24:09.977
31842
2017-01-14T14:41:59.410
2017-01-14T14:41:59.410
19526
19526
31831
answer