Question

我正在尝试将此输入框的最大数量设置为另一个输入框，但我遗漏了有关如何连接其中两个输入框的内容。这是我希望最大值基于另一个输入的当前值而改变的那个

<input id="movement-quantity" class="movement-quantity" type="number" step="1" min="0" max = "1" pattern="\d*" required>

这是我想从中获取值的输入，此值将自动更改其他代码，因此我正在尝试收听此值

<input id="store-from-current-quantity" class="store-from-current-quantity" type="text" disabled>

这是我目前正在使用的功能

    function getMaxValueForRequest()
{
    var requester = document.getElementById("movement-quantity");
    var currentItemAmount = parseInt(document.getElementById("store-from-current-quantity").value);
    requester.max = currentItemAmount;
}

这是脚本文件的开头，上面的函数在

中

//variables
var numberAv=  parseInt(document.getElementById("store-from-current-quantity").value);
numberAv.elX.onchange = getMaxValueForRequest;

Answer 1

使用Element.setAttribute

备注

我手动给出的#store-from-current-quantity在HTML中有一个值 - 我认为这是在你应用的其他地方设置的。
在{blur / submit / etc}之前，change事件监听器不会触发，因此您可能需要考虑keydown或keyup。

我对numberAv.elX.onchange感到困惑但是 - 为什么要尝试获取数字的elX属性？

我已删除此示例中第二个输入的disabled属性，您可以对其进行测试。

＆＃13;

function getMaxValueForRequest() {
  var requester = document.getElementById("movement-quantity");
  var currentItemAmount = parseInt(document.getElementById("store-from-current-quantity").value);
  requester.setAttribute('max', currentItemAmount);
}


// init once to set
getMaxValueForRequest()


// listen for changes
document.getElementById("store-from-current-quantity").addEventListener('change', function(event) {
  getMaxValueForRequest()
})

＆＃13;

<input id="movement-quantity" class="movement-quantity" type="number" step="1" min="0" max = "1" pattern="\d*" required>
<input id="store-from-current-quantity" class="store-from-current-quantity" type="text" value="5">

＆＃13;

Answer 2

以下代码段演示了如何使用以下方法将输入1的值与输入2的max属性同步：

input event
setAttribute()

段

var in1 = document.getElementById('in1');

in1.addEventListener('input', function(e) {
  var in2 = document.getElementById('in2');
  var out = document.getElementById('out');
  var val = parseInt(in1.value, 10);
  in2.setAttribute('max', val);
  out.value = in2.getAttribute('max');
}, false);

<form id='f1' name='f1'>
  <fieldset>
    <legend>Sync Input1 Value to Input2 Max</legend>
    <label>Input 1:
      <input id='in1' name='in1' type='number'>
    </label>
    <label>Input 2:
      <input id='in2' name='in2' type='number' max=''>
    </label>
    <br/>
    <br/>
    <label>Input 2 max="
      <output id='out' name='out'></output>"</label>

  </fieldset>
</form>

将输入框的max属性设置为另一个动态html的值

2 个答案:

段