Javascript 键控显示输入和复选框的总值

我有下面的代码，它非常适合添加复选框的值。如何向其中添加实际的输入框：

如果在输入中输入100，则总数将增加100

并在选中时仍添加所有复选框

工作样本：

html

<form action="" id="products">
<label><input type="checkbox" name="prod1" value="10" />$10 product 1</label>
<br />
<label><input type="checkbox" name="prod2" value="20" />$20 product 2</label>
<br />
<label><input type="checkbox" name="prod3" value="30" />$30 product 3</label>
<br />
<label><input type="checkbox" name="prod3" value="30" />$30 product 3</label> 
</form>

<p>Total $<span id="total">0</span></p>

我想补充一下：

<input id="prod4" type="number" value="">

$( "#prod4" )
  .keyup(function() {
    var value = $( this ).val()*6.5;
    $( "p" ).text( value );
  })
  .keyup();

$（“#产品4”）
.keyup（函数（）{
var值=$（this）.val（）*6.5；
$（“p”）。文本（值）；
})
.keyup（）；

---

我希望复选框和输入使用.keyup函数，以便#total自动更新。谢谢你的帮助。

以下是我是如何做到的，希望能对你有所帮助

<form action="" id="products">
<label><input type="checkbox" name="prod1" value="10" />$10 product 1</label>
<br />
<label><input type="checkbox" name="prod2" value="20" />$20 product 2</label>
<br />
<label><input type="checkbox" name="prod3" value="30" />$30 product 3</label>
<br />
<label><input type="checkbox" name="prod3" value="30" />$30 product 3</label> 
<br />
<input id="prod4" type="number" value="" />
</form>
<p>Total $<span id="total">0</span></p>

---

感谢Alexander，这是漫长的一天，他不是有意加入PHP的

<form action="" id="products">
<label><input type="checkbox" name="prod1" value="10" />$10 product 1</label>
<br />
<label><input type="checkbox" name="prod2" value="20" />$20 product 2</label>
<br />
<label><input type="checkbox" name="prod3" value="30" />$30 product 3</label>
<br />
<label><input type="checkbox" name="prod3" value="30" />$30 product 3</label> 
<br />
<input id="prod4" type="number" value="" />
</form>
<p>Total $<span id="total">0</span></p>

$(function(){
function sum() {
    var total = 0;
    $('#products').find('input:checkbox:checked').each(function(){
        total += parseFloat($(this).val());
    });

    var input = $('#prod4').val();

    if (input != "") {
        total += parseFloat(input);
    }

    $('#total').text(total);
}

$('#products').on('change', sum);
$('#prod4').keyup(sum);
});