Question

我的代码

function validate(e, id) {
  var reg = new RegExp('^\\d+$');
  if (reg.test($("#" + id).val())) {
    var value = $("#" + id).val();
    alert(value);
  } else {
    alert("fail");
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input name="input-type" type="number" id="number-input" oninput="validate(event,'number-input');">

这接受1.（任意数字后面的点）值休息一切都很好。

Answer 1

您可以尝试使用<input type="tel" ...>。这样，当用户输入1.时，您只会收到1.而不会1，并且还会在移动设备上打开数字键盘。

function validate(e, id) {
  var reg = /^[0-9]*(\.(?=[0-9]+))*[0-9]+$/;
  var value = $("#" + id).val();
  if (reg.test(value)) {
    console.log(value);
  } else {
    console.log("fail");
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input name="input-type" type="tel" id="number-input" oninput="validate(event,'number-input');">

您还可以参考How to get the raw value an <input type="number"> field?了解为什么1.返回1而不是1.

的更多信息

Answer 2

以下代码可能会对您有所帮助。在下面的代码中，当用户输入.时，它会被null替换。它只接受数字。这适用于input type="text"。变量currValue具有输入值。

search（）方法在字符串中搜索指定的值，并返回匹配的位置。搜索值可以是字符串或正则表达式。如果未找到匹配项，则此方法返回-1。

然后我正在使用.replace()

replace（）方法在字符串中搜索指定的值或正则表达式，并返回一个替换指定值的新字符串。

如果正则表达式不匹配，我在这里用null替换。正则表达式[^0-9]检查是否为数字。

JSFIDDLE

以下是代码：

$(function() {
  $('input').bind('keyup', function(event) {
    var currValue = $(this).val();

    if (currValue.search(/[^0-9]/) != -1) {

      alert('Only numerical inputs please');
    }

    $(this).val(currValue.replace(/[^0-9]/, ''));
    alert($(this).val());
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

<label>Digits Only:
  <input type="text" />
</label>
<br>
<br>

编辑： 在input type="number"中，我们必须强制它始终接受更新的val，因为许多事件在其中不起作用。因此，我必须在每个事件之后使用更新的值更新现有值。< / p>

所以我添加了

var v = $(this).val();
$(this).focus().val("").val(v);

因此，每次输入聚焦时，都会使用现有值更新值。

UPDATED FIDDLE FOR INPUT TYPE NUMBER

更新了代码段：

$(function() {
  $('input').bind('keyup input', function(event) {
    var v = $(this).val();
    $(this).focus().val("").val(v);

    var currValue = $(this).val();

    if (currValue.search(/[^0-9]/) != -1) {

      alert('Only numerical inputs please');
    }

    $(this).val(currValue.replace(/[^0-9]/, ''));
    alert($(this).val());
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>Digits Only:
  <input type="number" />
</label>
<br>
<br>

编辑2：对于特殊情况+和-。我认为这是一个我不确定的错误，但请查看下面的代码段。它适用于所有情况。希望它有所帮助。

FINAL FIDDLE

$(function() {
  $('input').bind('keyup', function(event) {
    var v = $(this).val();
    $(this).focus().val("").val(v);
    var currValue = $(this).val();
    $(this).val(currValue.replace(/[^0-9]/, ''));
    alert(v);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>Digits Only:
  <input type="number" name="test" min=0 save="" oninput="validity.valid ? this.save = value : value = this.save;">
</label>
<br>
<br>

希望它有所帮助。任何其他疑问都可以随意提问。

Answer 3

它起作用：

1   pass
1.  fail
1.1 pass

＆＃13;

function validate(e, id) {
  var value = $("#" + id).val() + "";
  if (new RegExp('^[0-9]+\.[0-9]+$').test(value)
 || ((new RegExp('^[0-9]+').test(value) && !value.includes(".")))
) {
    var value = $("#" + id).val();
    alert($("#" + id).val() + "->" + value);
  } else {
    alert("fail " + $("#" + id).val());
  }
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input name="input-type" type="text" id="text-input" oninput="validate(event,'text-input');">

＆＃13;

仅允许输入类型正则表达式中的数字位数。问题是我能够输入这个（1。），想要阻止它

3 个答案: