javascript - html 输入类型更改=数字 "available"值。还将更改另一个输入类型=数字 "Total"

Question

我想复制“可用”输入数字的更改并将其添加或减去到“总计”中

• 如果此人将“可用”更改为“3”，则“总计”将变为“9”。
• 如果用户将“可用”更改为“5”，则“总计”将变为“11”。

$('#id1').bind('keyup click', function() {
    $('#id2').val($(this).val());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type="number" name="total" id="id2" value="10">
<input type="number" name="available" id="id1" value="6">

但是我怎样才能让这段代码工作

Answer 1

您可以使用事件input 捕获该字段中的任何更改。

var $borrowed = $('#id3');
var $total = $('#id2');
$('#id1').on('input', function() {
    $total.val(+$(this).val() + +$borrowed.val());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type="number" name="total" id="id2" value="">
<input type="number" name="borrowed" id="id3" value="6">
<input type="number" name="available" id="id1" value="">