javascript - 从范围 slider 更新两个

Question

感谢您帮助更新范围 slider 和隐藏字段值中的两个不同值。

目前，这完美地更新了费用输出，并显示了任何 slider 值更改之前的总输出，但当 slider 是用户时，第二个输出显示即。 “undefined300”，其中 300 是 slider 值。它基本上不是添加隐藏字段值。当然我在做一些愚蠢的事情。

<input type="range" min="0" max="100" value="50" id="fee" step="1" oninput="outputUpdate(value)">
<input type="hidden" id="subTotal" value="1000" />

$<output for="fee" id="fee"> </output>

$<output for="fee subTotal" id="total"> </output>

<script>
    function outputUpdate(fee, subTotal) {
        document.querySelector('#fee').value = fee;
        document.querySelector('#subTotal').value = subTotal;
        var total = +subTotal + +fee
        document.querySelector('#total').value = total;
    }
</script>

Answer 1

您正在调用 outputUpdate(value)，但您的函数需要两个参数，因为它是 outputUpdate(fee, subTotal){ ... }，因此 subTotal 将是“未定义”。还有其他问题。

尝试这个更新的脚本:

<script>
function outputUpdate(fee) {
    document.querySelector('#fee').value = fee;
    var subTotal = document.querySelector('#subTotal').value;
    var total = parseInt(subTotal) + parseInt(fee);
    document.querySelector('#total').value = total;
}
</script>

演示:http://jsbin.com/pudequ/1/