Question

这些代码背后的想法是让守望者寻找以下两种情况：

如果在计划开始之前手动启用了colorChanged，并且计划的时间结束，请关闭colorChange。
在计划时间准备就绪时打开colorChange。

我确实制作了检查状态和更改类的代码，但是无法弄清楚如何制作计时功能，请你建议可以做些什么才能实现呢？

$('.auto-control').click(function(){
  $(this).toggleClass('auto-enabled');
  $('.target').toggleClass('colorChanged');
});

$('.manual-control').click(function(){
  $(this).toggleClass('manual-enabled');
  $('.target').toggleClass('colorChanged');
  console.log(1)
});

setInterval(function() {

  // 24h format
  
  // Scenario 1, currentTime isn't within the schedule and the filter should be turned Off 
  // var currentTime = 14;
  
  // Scenario 2, currentTime is within the schedule and the filter should be turned On
  var currentTime = 16
  var startTime = 14;
  var endTime = 4;

  // Scenario 1. colorChanged is On
  if ($('.target').hasClass('colorChanged')) {
    // Control enabled = True
    if ($('.auto-control').hasClass('auto-enabled')) {
      // Current Time is not within the Schedule
      if (!startTime <= currentTime || !currentTime < endTime) {
        console.log('time to turn off')
        $('.target').toggleClass('colorChanged');
        $('.manual-control').removeClass('manual-enabled');
      }

    }
    
  // Scenario 2. colorChanged is Off
  } else {
    // Control enabled = True
    if ($('.auto-control').hasClass('auto-enabled')) {
      // Current time is within the Schedule 
      if (startTime <= currentTime || currentTime < endTime) {
        console.log('time to turn on')
        $('.target').toggleClass('colorChanged');
      }
    }
  }


}, 1000)

.target {
  width: 50px;
  height: 50px;
  background-color: red;
}

.colorChanged {
  background-color: green;
}

button {
  color: red;
}

.auto-enabled {
  color: green;
}

.manual-enabled {
  color: blue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div class='target'>&nbsp</div>

<button class='auto-control'>Auto-control</button>
<button class='manual-control'>Manual-control</button>

Answer 1

我认为你的主要问题是使用！在startTime和currentTime之前。它会将它们转换为布尔值（true或false），并且根本不适用于时间你应该这样否定支票：

if（！（startTime＆lt; = currentTime || currentTime＆lt; endTime））{

仅在指定的时间段内运行代码

1 个答案: