Question

我有一个输入文本表单，需要插入1到10之间的值。

我试图设置一个掩码来自定义它，但它让我写入超过10的值，如何将唯一可能的值设置为1到10而不是更少或更多？

表格 input type =“text”name =“level”id =“level”

我过去使用的面具只接受数字并使其长2位

function maskFormatterForLvl(val) {
$(val).mask("ZZ", {
    translation: {
        'Z': {
            pattern: /[0-9]/,
            optional: true
        }
    }
});

};

我尝试使用“max”属性，但它没有用，可能是因为我是JavaScript的新手

Answer 1

如果您的输入字段值是数字，那么您可以使用输入类型＆＃39;数字＆＃39; 。 min和max属性表示要输入的数字范围。希望这更简单。

<input type="number" min="0" max="10">

<强>更新

为了隐藏箭头，您可以使用以下内容。

/* Webkit browsers like Safari and Chrome */
    input[type=number]::-webkit-inner-spin-button, 
    input[type=number]::-webkit-outer-spin-button { 
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        margin: 0; 
    }
/* For Firefox */
    input[type='number'] {
       -moz-appearance:textfield;
    }

Answer 2

如果必须使用type="text"

，则可以使用此正则表达式

<input type="text" pattern="([0-9])|(10)">

Answer 3

您可以使用文本输入，只允许使用charCode输入数字。从48到57是0-9的键盘数字。

如果通过此验证，则检查它是否超出了输入的最大值。

对于最小值，用户无法输入0以下的内容，因为为了做到这一点，他应该能够编写-，这不会传递第一个条件（仅限数字）< / p>

＆＃13;

const input = document.getElementById('level')
input.onkeypress =  function(e) {
    var ev = e || window.event;
    if (ev.charCode < 48 || ev.charCode > 57) {
      return false;
    } else if (this.value * 10 + ev.charCode - 48 > this.max) {

      return false;
      } else if (this.value * 10 + ev.charCode - 48 < this.min) {

      return false;
    } else {
      return true;
    }
  }

＆＃13;

<input type="text" name="level" id="level" min="1" max="10" maxlength="2">

＆＃13;

如何在输入文本中设置唯一可能的值

3 个答案: