Mix/max 范围应用于特定数字输入字段

Question

使用 a solution from a relevant question，如何使用以下脚本通过将输入范围限制在 0 到 0.20 之间来仅处理特定输入？例如，我有两个 ID 为 "A" 和 "B" 的数字输入，我只希望以下脚本对输入 id="A".

起作用

$('input').on('input', function () {
    
    var value = this.value;
    
    if (value !== '') {
        value = parseFloat(value);
        
        if (value < 0)
            this.value = 0;
        else if (value > 0.20)
            this.value = 0.20;
    }
    
});

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

<input type="number" id="a" value="0" />
<input type="number" id="b" value="0" />

Answer 1

使用特定元素的 ID。

$('#a').on('input', function () {

演示：

$('#a').on('input', function() {

  var value = this.value;

  if (value !== '') {
    value = parseFloat(value);

    if (value < 0)
      this.value = 0;
    else if (value > 0.20)
      this.value = 0.20;
  }

});

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

<input type="number" id="a" value="0" />
<input type="number" id="b" value="0" />

或者，如果您只需要支持 HTML5 兼容的浏览器，您可以放弃 JavaScript 并简单地在元素本身上使用 min 和 max 属性。也可以用step来控制按钮增加多少数值，这在输入范围这么小的场景下有意义：

<input type="number" id="a" value="0" min="0" max="0.2" step="0.1" />
<input type="number" id="b" value="0" />

Answer 2

将选择器从选择所有输入更改为仅选择您想要的输入，例如$('#a').on('input', ...

Mix/max 范围应用于特定数字输入字段

Mix/max range applied to specific number input field

html

javascript

jquery

jquery-selectors