首页 > 解决方案 > 用 JS 改变时间

问题描述

我希望在不同的时间执行不同的功能,而不会相互重叠。

一些上下文-我想一次删除一个页面的元素,而不是在一段时间内一次全部删除。

例如,在凌晨 1:00 移除元素 1,然后在凌晨 2:00 移除元素 1 + 2,依此类推。

元素的删除将使用 JQuery 完成。

编辑:

    window.setInterval(function(){ // Set interval for checking
    var date = new Date(); // Create a Date object to find out what time it is
    if(date.getHours() === 12 && date.getMinutes() === 18){ // Check the time
        $(function() {
    //Remove Elements
    $('#element1').remove();
       })
}, 10000); // Repeat every 10000 milliseconds (10 seconds)

到目前为止,这是我为一个函数计时的方法 - 看到错误:Uncaught SyntaxError: Unexpected token ,

标签: javascriptjquerydatetime

解决方案


这是一个简单的代码片段,它有两个用于计划删除元素的变体。

  • 选项 1:以毫秒为单位指定after,它会在毫秒后通过给定的选择器删除元素。调用后超时开始计算ScheduledRemover.work(settings);
  • 选项 2:指定at为可以具有以下结构的对象

__

at: {
    h: 14, // (Optional) the hour at which remove should be executed
    m: 30, // (Optional) the minute at which remove should be executed
    s: 23  // (Optional) the second at which remove should be executed
}

该代码将计算当前时间和所需删除时间的差值,并将设置超时setTimeout用于执行删除。这样您就不必每次都检查时间setInterval是否到了。

希望这会有所帮助。如果有任何问题,请告诉我。干杯!

var ScheduledRemover = (function() {

  function _work(settings) {
    for (let i = 0; i < settings.length; i++) {
      let schedulerRemove = settings[i];
      if (schedulerRemove.at) {
        /* Remove element at specific time */
        var currentTime = new Date();
        var removalTime = new Date();
        if (typeof schedulerRemove.at.h === 'number') {
          removalTime.setHours(schedulerRemove.at.h);
        }
        if (typeof schedulerRemove.at.m === 'number') {
          removalTime.setMinutes(schedulerRemove.at.m);
        }
        if (typeof schedulerRemove.at.s === 'number') {
          removalTime.setSeconds(schedulerRemove.at.s);
        }

        var removeAfter = removalTime - currentTime;
        if (removeAfter >= 0) {
          /* If difference is less than 0 then time for the removal passed */
          setTimeout(function() {
            $(schedulerRemove.selector).remove();
            console.log(schedulerRemove.selector + ' removed ...');
          }, removeAfter);
        } else {
          console.log('Time passed for removing ' + schedulerRemove.selector);
        }
      } else if (schedulerRemove.after) {
        /* Remove element after specific time */
        setTimeout(function() {
          $(schedulerRemove.selector).remove();
          console.log(schedulerRemove.selector + ' removed ...');
        }, schedulerRemove.after);
      }
    }
  }

  return {
    work: _work
  }
}());

var settings = [{
    selector: '#element1',
    after: 2000
  },
  {
    selector: '#element2',
    after: 5000
  },
  {
    selector: '#element3',
    at: {
      h: 14,
      m: 49
    }
  },
  {
    selector: '#element4',
    at: {
      h: 14,
      m: 53,
      s: 1
    }
  },
  {
    selector: '#element5',
    after: 30000
  }
];

ScheduledRemover.work(settings);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="element1">Element 1</div>
<div id="element2">Element 2</div>
<div id="element3">Element 3</div>
<div id="element4">Element 4</div>
<div id="element5">Element 5</div>


推荐阅读