选中所选值之间的 Javascript 集复选框

Javascript set checkbox checked between selected values

本文关键字：Javascript 复选框 之间      更新时间：2023-09-26

遵循代码

<select id="choice_option">
    <option value="00">Hourly</option>
    <option value="15">15 minutes</option>
    <option value="30">30 minutes</option>
    <option value="45">45 minutes</option>
</select>
<select id="from_time">
    <option value="6:00">6:00</option>
    <option value="7:00">7:00</option>
    <option value="8:00">8:00</option>
    ...
</select>
<select id="to_time">
    <option value="6:00">6:00</option>
    <option value="7:00">7:00</option>
    <option value="8:00">8:00</option>
    ...
</select>
<input type="checkbox" value="6:00" class="times" />6:00
<input type="checkbox" value="6:00" class="times" />6:15
<input type="checkbox" value="6:00" class="times" />6:30
<input type="checkbox" value="6:00" class="times" />6:45
<input type="checkbox" value="6:00" class="times" />7:00
<input type="checkbox" value="6:00" class="times" />7:15
<input type="checkbox" value="6:00" class="times" />7:30
<input type="checkbox" value="6:00" class="times" />7:45
...
var choice = document.getElementById('choice_option');
Event.add('choice_option', 'change', function() {
    checkTimes(choice);
});
var checkTimes = function(elem) {
    var from = document.getElementById('from_time'),
        to = document.getElementById('to_time'),
        times = document.querySelectorAll('.times'),
        len = times.length,
        i, t, startTime, stopTime;
    for(i = 0; i < len; i++) {
        t = times[i].value.slice(-2);
        startTime = from.options[from.selectedIndex].value;
        stopTime = to.options[to.selectedIndex].value;
        if(times[i].checked) {
            times[i].checked = false;
        }
        if(elem.options[elem.selectedIndex].value == t) {
            times[i].checked = true;
        }
    }
}

我想要实现的是将check boxes设置为在用户选择的小时数"from_time"和"to_time"之间检查。

我做到了根据以下时间选中

复选框的地步：00, :15, :30或 45 分钟。但是当复选框应该在选定时间之间时，我陷入了困境。

因此，如果用户选择 15 分钟，从 06：00 到 14：00，我想要每个具有值的checkbox 6:15, 7:15 ， 8:15 ... 14:15待检查。

我试图比较"from_time"和"to_time"，但到目前为止没有运气。

谢谢

为什么不采取更简单的方法...

http://codepen.io/anon/pen/jEBQre

<select id="fromHour">
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
</select>
<select id="fromMinutes">
  <option value="00">00</option>
  <option value="15">15</option>
  <option value="30">30</option>
  <option value="45">45</option>
</select>
<span>to</span>
<select id="toHour">
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
</select>
<select id="toMinutes">
  <option value="00">00</option>
  <option value="15">15</option>
  <option value="30">30</option>
  <option value="45">45</option>
</select>

我找到了。我应该做的是这个

而不是

if(elem.options[elem.selectedIndex].value == t) {
   times[i].checked = true;
}

我改成了

if(startTime <= times[i].value && stopTime >= times[i].value 
&& elem.options[elem.selectedIndex].value == t) {
    times[i].checked = true;
}
相关文章：