输入范围值将倒计时，但不会向上倒计时

Input range value will count down but not up

本文关键字：倒计时 范围 输入      更新时间：2023-09-26

***编辑：找到解决方案。 为将来遇到此问题的用户添加必要的内容。

我完全不知道为什么我的 JS 可以让这个小部件倒计时单个整数，但是当它计数时，就好像它连接"1"到我的盒子末尾一样。

也许你可以马上发现它：

此处标记：

<input type="text" name="volume" id="delta" class="change" value="50" />
<input id="slider" type="range" min="0" max="100" step=".2" value="50" />

js 在这里：

var timeout, tabMinus = $('#minus'), tabPlus = $('#plus');
//slider functionality
$('#slider').mouseup(function() {
    $('#delta').val($('#slider').val());
});
$('#delta').keyup(function() {
   $('#slider').val($('#delta').val());
});
//plus-minus tab functionality
tabMinus.mouseup(function() {
    $('#delta').val($('#slider').val() - 1);
    $('#slider').val($('#delta').val() - .2);
});
tabPlus.mouseup(function() {
    $('#delta').val($('#slider').val() + 1);
    $('#slider').val($('#delta').val() + .2);
    console.log($('#delta').val());
});

如果有办法在我拖动滚动条时看到实时更新，而不是在鼠标向上重新渲染，也会加分。

这是小提琴：https://jsfiddle.net/jnurbina/rvf8j6te/1/

更新了小提琴

因为.val()返回字符串，所以你应该解析它，例如使用 parseInt() 或 parseFloat() ：

//plus-minus tab functionality
tabMinus.mouseup(function() {
    $('#delta').val(parseInt($('#slider').val()) - 1);
    $('#slider').val(parseFloat($('#delta').val()) - .2);
});
tabPlus.mouseup(function() {
    $('#delta').val(parseInt($('#slider').val()) + 1);
    $('#slider').val(parseFloat($('#delta').val()) + .2);
});

它会倒计时但不倒计时的原因是二进制-运算符没有重载，它总是意味着减法。（有一个一元-运算符，但接受两个操作数（二进制操作 数 ）的运算符始终是减法）。因此，JavaScript 引擎将值强制为数字并执行减法。但是二进制+运算符是重载的，它是为字符串（串联）和算术（加法）定义的。当你给它字符串时，它会连接而不是加法，而不是像-那样强制。

相关文章：