输入类型数字时以 html 形式验证数字答案

【问题标题】：Number validation in html form on input of type number输入类型数字时以 html 形式验证数字
【发布时间】：2018-10-23 22:21:04
【问题描述】：

我正在考虑用户可以输入数字类型 <input> 并使用 jquery 验证输入的所有可能性。

在输入字段中，我只输入了一个简单的点“。”

if($("#timetaken").val() == "")

这个 if 语句执行时响应说它是空的。有一个“。”点在其中，从逻辑上讲，它应该跳过这个并执行告诉我们它不为空的else。

我还使用输入“1”进行了测试。这是不完整的

console.log($("#timetaken").val().toString().indexOf("."));

它返回-1，这意味着'。'不存在并被忽略。

问题是有没有办法在数字类型的<input> 标记中验证这两个输入？

谢谢。

【问题讨论】：

我可能建议在事件处理程序中运行debugger; 并查看e.target.validity 属性。那里似乎有一些属性可以为您提供有关用户输入内容的一些信息，而无需实际告诉您他们输入的内容。
我认为正则表达式对我来说可能是一个更好的解决方案。早该想到的。
我认为您应该在问题中包含您的确切 HTML — 是 <input type="number" ...>（我认为是，基于您的“类型编号”声明）还是 <input type="text" ...> ? 根据你写的，我认为我的假设是正确的，但不要让我做假设；明确。

标签： javascript jquery html validation

【解决方案1】：

如果您尝试使用一些非数字字符（如单个点）测试 number 输入。是的，确保空通过。

我建议您使用text 输入和regular expression 来测试您希望的值。这种输入类型没有奇怪的行为或限制，并且“正则表达式”可以完全测试您有任何要求的值。

那将是（从我可以从你的问题中读到的）类似于：

$("#go").on("click",function(){
  var value = $("#test").val();
  var regex = /((\d){1,9}\.?\d*)|(\d*\.?(\d){1,9})/;  // {1,9} means at least 1 and up to 9 digits.
  if(regex.test(value)){
    console.log("Value is ok");
  }else{
    console.log("Value fails.");
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" id="test"> <button id="go">Test</button>

所以浮点数或自然数都可以。没有别的了。

正则表达式测试员：regex101.

【讨论】：