When I entered only half-width numbers in HTML text onkeydown, the numeric keypad does not work.

Asked 2 years ago, Updated 2 years ago, 97 views

Thank you for your help.

Windows, VisualStudio 2015 ASP.NET (VisualBasic), .NET Framework 4.6,
Local IIS, browsers are developed in Google Chrome, IE, and .

Put text (TextBox in ASP.NET, named txtTest) on one page and
Set the function (named numOnly()) so that only half-width numbers can be entered.

The HTML source is as follows:
The function is <head><script></script></head>
It is written in .

<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>
<!--
// allow only half-width numbers to be entered
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>... AA
    </div>
    </form>
</body>
</html>

Also, in the program
When loading the page,
Run the following code:

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

Also, if you run it in your browser, the source of *A above will be
The following is true:

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

This allows you to use the numeric keys next to the top of your computer's keyboard. You can now enter only half-width numbers, but
You cannot enter half-width numbers with the numeric keypad.

I'd like to be able to do this.
If there is any appropriate way,
I would appreciate it if you could let me know.

Thank you for your cooperation.

(Refer to function)
http://javascript.eweb-design.com/1205_no.html

<SCRIPT> does not appear to be appropriate for ASP.NET and should be lowercase.
"The ""language="JAVASCRIPT"" part is also removed due to an error."

javascript html css visual-studio .net

2022-09-30 21:21

2 Answers

You cannot enter the numeric keypad on the page you are referring to.
This is because the keyCode obtained when onkeydown is different between the top keyboard and the numeric keypad.

Try using onkeypress instead of onkeydown.

Note: Key Code List


2022-09-30 21:21

If you want input that only accepts half-width numbers, you may be able to see the keycode of keydown and keypress, but it seems unrealistic because the specifications vary depending on the browser and terminal, and I can't handle the copy.

Value entered → Convert full-width numbers to half-width numbers → Delete non-half-width numbers

How about an approach that converts values like this?

function digitsFilter(val){
  return val.replace(/[0-9]/g, function(s) {return String.fromCharCode(s.charCodeAt(0)-0xFEE0);}).replace(/[^0-9]/g, '');
}
<input type="text" onchange="this.value=digitsFilter(this.value)">

Add demo to change value in setInterval

function bindDigitsFilter(input){
  
  var intervalId = null;
  
  varfilterValue=function(){
    if(!/[^0-9]/.test(input.value){
      return;
    }
    varlen=input.value.length;
    variable end = input.selectionEnd;
    input.value = input.value.replace(/[0-9]/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')); 
<input type="text" id="input">


2022-09-30 21:21

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.