jq 踩踩踩 input range进度条

<input class="slider" type="range" id="slider"  value="0" step="1" min="0" max="0" msgId = "${i}"/>

input type有很多属性 其中range可以设置成进度条事件

踩了几个坑 记录一下

1、平时习惯了用

$('.类名') 这种方式来获取元素，还有另一种获取dom元素的方式document

这两个在赋值功能上，是完全不对等的，这点需要注意。

如以下代码

    $(".player" + index + " .slider").attr("value", 0);
    document.querySelector(".player" + index + " .slider").value = 0;

虽然都是获取到了这个input 但要是把document.querySelector 换成 $是行不通的

2、

    $(".player" + index + " .slider").attr("value", 0);
    document.querySelector(".player" + index + " .slider").value = 5;

input 的range 其中的value 和进度条的展示状态 value没有被监听的情况下 value值是多少进度条就是多少

但value被监听之后 ，attr的值设置属性，value = 0；这时候进度条的值就必须是赋值

document.querySelector(".player" + index + " .slider").value = 5;

最后 attr赋值 不等于 document的赋值