何时应用ConcurrentSkipListMap？(When should I use ConcurrentSkipListMap?)

 你错过了几件事情： 
 
 
 
 displayValue不在HTML中，但它不是问题的主要原因。 
 
 
 你没有针对jQ选择中的实际元素，你只有数组结果（也被称为“混合JS与jQ”），选择该数组中的第一个元素（如果你的目标是正确的，应该只有一个元素），然后使用它。 
 
 
 对滑块位置的更改没有事件处理。 基本上，您的代码执行一次并计算一次小时和分钟，但从不重新计算滑块移动的时间 
 
 
 这是修复它的一种方法： 
 
 HTML： 
 
<div class="slidecontainer">
  <h3 id="displayValue">
   <span id="hours">min</span>
   <span id="minutes">hour</span>
  </h3>
  <input type="range" min="1" max="1440" value="500" class="slider" id="myRange">
</div>
 
 JS： 
 
var slider = document.getElementById("myRange");
var output = document.getElementById("displayValue");
var hours = Math.floor(slider.value / 60);
var minutes = slider.value % 60;
var minuteOutput = $("#minutes")[0];
var hourOutput = $("#hours")[0];
var hours = Math.floor(slider.value / 60);
var minutes = slider.value % 60;
hourOutput.innerHTML = hours;
minuteOutput.innerHTML = minutes

$('.slider').change(function() {
                var hours = Math.floor(slider.value / 60);
        var minutes = slider.value % 60;
        hourOutput.innerHTML = hours;
        minuteOutput.innerHTML = minutes
});
 
 CSS可以保持不变:) 
 
 这里是一个演示： 小提琴 

You are missing a couple of things:
 
 
 
displayValue is not in the HTML but it's not the main cause of problems.
 
 
You don't target actual elements in your jQ selections, you only have array results (known also as "mixing JS with jQ" ), select the first element in that array (should be only one if you targeted right) then work with it.
 
 
You have no event handling for the changes in slider position. Basically, your code executes one and calculates hours and minutes once, but NEVER recalculates when the slider moves
 
 
Here is one way of fixing it:
 
HTML:
 
<div class="slidecontainer">
  <h3 id="displayValue">
   <span id="hours">min</span>
   <span id="minutes">hour</span>
  </h3>
  <input type="range" min="1" max="1440" value="500" class="slider" id="myRange">
</div>
 
JS:
 
var slider = document.getElementById("myRange");
var output = document.getElementById("displayValue");
var hours = Math.floor(slider.value / 60);
var minutes = slider.value % 60;
var minuteOutput = $("#minutes")[0];
var hourOutput = $("#hours")[0];
var hours = Math.floor(slider.value / 60);
var minutes = slider.value % 60;
hourOutput.innerHTML = hours;
minuteOutput.innerHTML = minutes

$('.slider').change(function() {
                var hours = Math.floor(slider.value / 60);
        var minutes = slider.value % 60;
        hourOutput.innerHTML = hours;
        minuteOutput.innerHTML = minutes
});
 
CSS can stay the same :)
 
Here is a demo: fiddle