【问题标题】:Input - Limit number range输入 - 限制数量范围
【发布时间】:2015-12-07 05:58:14
【问题描述】:

我有一个文本input,我想将其限制为数字。没有其他字符。我也想限制在 0 - 255 之间。

如果输入了“非法”字符或数量,我希望它等待一秒钟然后删除该字符或数字。到目前为止,我能够得到非法字符。

这是我想做的:

  • 稍等片刻,然后将其删除。
  • 限制数字从 0 到 255。

如果输入的数字超过 255,我只想等待最后一个数字,然后自行删除。就像“非法”字符一样。

我已经实现了非法字符。代码如下:

JSFiddle

$('input[name="number"]').keyup(function(e) {
  if (/\D/g.test(this.value)) {
    // Filter non-digits from input value.
    this.value = this.value.replace(/\D/g, '');
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input name="number" />

【问题讨论】:

标签: javascript jquery html input


【解决方案1】:

尝试使用if 条件检查this.value 是否大于255,如果为true,则使用String.prototype.slice() 将this.value 设置为输入的前两个字符

等一下怎么样?

尝试使用setTimeout()

function disableInput(el) {
  // create array of checks on `el.value`
  var checks = [/\D/g.test(el.value), el.value > 255];
  // if `el.value` contains non-digit character,
  // or is greater than 255 ;
  // `Array.prototype.some()` checks for `true` value
  // if either `checks[0]`, or `checks[1]` is `true` do stuff
  // else set `el.value` to user input
  if (checks.some(Boolean)) {
    // disable input
    $(el).prop("disabled", true)
    // delay 1 second
    setTimeout(function() {
      if (checks[0]) {
        // Filter non-digits from input value.
        el.value = el.value.replace(/\D/g, '');
      }
      // if `this.value` greater than 255 , set `this.value` to 
      // first two characters of input
      if (checks[1]) {
        el.value = el.value.slice(0, 2);
      };
      $(el).prop("disabled", false).val(el.value).focus()
    }, 1000)
  }      

}


$('input[name="number"]').keyup(function(e) {
  disableInput(this)
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input name="number" />

【讨论】:

  • 感谢您的回答!但是如果你输入一个大于 255 的值,我不希望它回到 255,我只想删除最后一个数字。
  • 不错的答案,虽然如果使用keydown 会“看起来”更好;)
  • "但是如果你输入一个大于 255 的值,我不希望它回到 255,我只想删除最后一个数字" 如果@输入987654330@,结果应该是25 ?
  • @Horay 查看更新后的帖子。使用.slice() 代替将this.value 设置为255
  • @guest271314 这行得通!让它等一下怎么样?
猜你喜欢
  • 2023-03-04
  • 2018-12-16
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-12-24
  • 2018-08-30
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多