如何限制输入框只允许数字和小数点 JavaScript？

任务是在用户在输入框中输入内容时验证输入。在这里，我们只允许十进制和整数，但不允许任何其他符号。以下是讨论的一些技术。

方法一：

• 用于验证输入的正则表达式。
• 每次输入一个字符，整个输入都与 RegExp 进行匹配以检查有效性。
• 如果有效，则使字符有效并添加到输入中，否则不添加。

示例 1：此示例使用上面讨论的方法，使用 JavaScript。

  

    
        How to restrict input box to allow
      only numbers and decimal point JavaScript?
    

  

    
      
            GeeksForGeeks  
        
    
    
    
        Type Here:
        
    
    
    
    
    
        var el_up = document.getElementById("GFG_UP");
        var el_down = document.getElementById("GFG_DOWN");
        el_up.innerHTML = 
          "Type in the box to see whether the input is valid or not.";
        var RegExp = new RegExp(/^\d*\.?\d*$/);
        var val = document.getElementById("input").value;
  
        function valid(elem) {
            if (RegExp.test(elem.value)) {
                val = elem.value;
                el_down.innerHTML = "Typed Valid Character.";
            } else {
                elem.value = val;
                el_down.innerHTML = "Typed Invalid Character.";
            }
        }
    

  

输出：

• 在点击按钮之前：
  
• 点击按钮后：
  

方法二：

• 每次输入一个字符时，都会检查这个字符是否有效。
• 这个例子也是检查输入的小数位数，一个不能输入2个小数。
• 如果字符有效，则添加到输入中，否则不添加。

示例 2：此示例使用上述使用 JQuery 讨论的方法。

  

    
        How to restrict input box to allow
      only numbers and decimal point JavaScript?
    

  

      
            GeeksForGeeks  
        
    
    
    
        Type Here:
        
    
    
    
    
    
        var el_up = document.getElementById("GFG_UP");
        var el_down = document.getElementById("GFG_DOWN");
        el_up.innerHTML = 
          "Type in the box to see whether the input is valid or not.";
  
        function isValid(el, evnt) {
            var charC = (evnt.which) ? evnt.which : evnt.keyCode;
            if (charC == 46) {
                if (el.value.indexOf('.') === -1) {
                    return true;
                } else {
                    return false;
                }
            } else {
                if (charC > 31 && (charC < 48 || charC > 57))
                    return false;
            }
            return true;
        }
  
        function GFG_Fun(t, evnt) {
            var a = isValid(t, evnt);
            if (a) {
                el_down.innerHTML = "Typed Valid Character.";
            } else {
                el_down.innerHTML = "Typed Invalid Character.";
            }
            return a;
        }
    

  

输出：

• 在点击按钮之前：
  
• 点击按钮后：