Question

我有一个文本框，用户只能在0-10之间输入，允许的小数部分为.5 因此，可以输入0或.5或1.5或4等。在这里我可以添加所有数字：

<script>
  function handleChange(input) {
    if (input.value < 0) input.value = 0;
    if (input.value > 10) input.value = 10;
  }
</script>
<input type="text" onchange="handleChange(this);" />

我需要警告输入错误并重置该文本框。

Answer 1

在扩展@Vishnu Badhoriya的评论时，我们还可以执行以下操作：

HTML

<input id="number" type="number" min="0" max="10" step="0.5" onchange="roundHalf(this.value)">

JS（jQuery）

function roundHalf(num) {
  if (num > 10) {
    $('#number').val(10);
  } else if (num < 0) {
    $('#number').val(0);
  } else {
    $('#number').val(Math.round(num*2)/2);
  }
}

您也可以采用非jQuery的方法，但是出于演示的方便，我选择这样做。这样可以确保用户将无法输入自己的值。

在此处查看CodePen，以查看其实际效果：
https://codepen.io/anon/pen/RBoJGB

编辑：忘记实现另一个约束，为0 <= num <=10。已将其添加到代码段中。

如何使文本框只接受0-10之间的数字，而只接受小数部分的.5？

1 个答案: