Javascript 如何根据小时和分钟加载站点

我有四个屏幕，我想按以下顺序显示

屏幕1（2秒）->屏幕2（2秒）->屏幕3（2秒）

我还有第四个屏幕，只有在时间介于05:55-06:05和17:55-18:05之间时才会显示

为了实现这一点，我的代码如下：

function timecondition() {
        var hours = new Date();
        var minutes = new Date();
        var h = hours.getHours();
        var m = minutes.getMinutes();
        var timecondition;
        if((h == 5 && m >= 55) || (h == 6 && m <= 5) || (h == 17 && m >= 55) || (h == 18 && m <= 5)) {
            timecondition = true;
        }
        else {
            timecondition = false;
        }
        return timecondition;
    }
    $(document).ready(
        function() {            

            setInterval(function() {
                setTimeout(function() {
                    if(timecondition()) {
                        $('#show').load("http://localhost:8084/test/screen4");
                    }
                    else {
                        $('#show').load("http://localhost:8084/test/screen1");
                    }
                }, 2000);
                setTimeout(function() {
                    if(timecondition()) {
                        $('#show').load("http://localhost:8084/test/screen4");
                    }
                    else {
                        $('#show').load("http://localhost:8084/test/screen2");
                    }
                }, 4000);
                setTimeout(function() {
                    if(timecondition()) {
                        $('#show').load("http://localhost:8084/test/screen4");
                    }
                    else {
                        $('#show').load("http://localhost:8084/test/screen3");
                    }
                }, 6000);
            }, 6000);      
        }
    );

函数时间条件（）{
var小时数=新日期（）；
var minutes=新日期（）；
var h=hours.getHours（）；
var m=minutes.getMinutes（）；
var时间条件；
如果（（h==5&&m>=55）| |（h==6&&m=55）| |（h==18&&m屏幕2->屏幕3）
但一旦时钟到达05:55，它就不会显示第四个屏幕，就像我打算的那样。
当我在时间条件内启动应用程序时，例如在05:56，它会显示第四个屏幕，但在几分钟后时间条件不再为真时，它不会离开屏幕4

是因为我需要动态函数吗？
这里有几个潜在的错误

1.你花了两次时间
每次调用
new Date（）
时，您都在拍摄一个瞬间的快照。在这种情况下，它们之间的距离仅为毫秒，但这仍然是一个bug

var hours = new Date();
var minutes = new Date();

一个对象就足够了：

var now = new Date();
var h = now.getHours();
var m = now.getMinutes()

2.你的时间条件不对
如果希望屏幕的持续时间不同，可以大致如下所示：

 function slideshow() {
    var screens = [
        {url: "http://localhost:8084/test/screen1", t: 2000},
        {url: "http://localhost:8084/test/screen2", t: 3000},
        {url: "http://localhost:8084/test/screen3", t: 10000}
    ];
    var specialScreen = "http://localhost:8084/test/screen4";
    // Contains the index of currently shown screen or -1
    // when the special screen is shown
    var currentScreen = 0;
    // Cache the element here so we don't need to search for it every two seconds
    var show = $('#show');

    function timecondition() {
        var now = new Date();
        var h = now.getHours();
        var m = now.getMinutes();
        h = h % 12;
        return (h == 5 && m >= 55) || (h == 6 && m <= 5);
    }

    var step = 1000;
    var screenTimer = 0;
    function update() {
        if (timecondition()) {
            if (currentScreen != -1) {
                show.load(specialScreen);
                currentScreen = -1;
            }
            return;
        }
        if ((screenTimer += step) >= screeens[currentScreen].t) {
            currentScreen = (currentScreen + 1) % screens.length;
            show.load(screens[currentScreen].url);
            screenTimer = 0;
        }
    }
    setInterval(update, step);
}
$(document).ready(slideshow);

函数幻灯片放映（）{
变量屏幕=[
{url:“http://localhost:8084/test/screen1“，t:2000}，
{url:“http://localhost:8084/test/screen2“，t:3000}，
{url:“http://localhost:8084/test/screen3“，t:10000}
];
变量特殊屏幕=”http://localhost:8084/test/screen4";
//包含当前显示屏幕的索引或-1
//当显示特殊屏幕时
var currentScreen=0；
//在这里缓存元素，这样我们就不需要每两秒钟搜索一次
var show=$（“#show”）；
函数timecondition（）{
var now=新日期（）；
var h=now.getHours（）；
var m=now.getMinutes（）；
h=h%12；
返回（h==5&&m>=55）| |（h==6&&m=screens[currentScreen].t）{
currentScreen=（currentScreen+1）%screens.length；
show.load（屏幕[currentScreen].url）；
屏幕计时器=0；
}
}
设置间隔（更新，步骤）；
}
$（文档）.ready（幻灯片）；
我不知道为什么屏幕4没有显示，但是我看到您的布尔条件无效，因为您没有将小时和分钟组合在一起，所以5:05、17:05和18:55等现在也匹配。也没有必要创建两个现在的日期。哇，非常感谢Hubert！太好了！我还有一个小问题。我该怎么办当我需要屏幕的不同间隔时打开？例如屏幕1 3秒、屏幕2 10秒和屏幕3 5秒？@mrk我会选择一个最大公约数的间隔，并在该间隔内计数。在这种情况下，您将设置一个1的间隔，并倒计时一个数字，例如从10开始。一旦它达到0，切换屏幕，重置该计数器然后选择下一个数字。你可以使用一组倒计时。顺便说一句，如果你的屏幕不随时间变化太多，你也可以只加载一次，一次显示一个，而另一个隐藏起来。这将大大减少服务器流量，并使你的网页在初次加载后可以脱机运行。嗯，我不明白你的意思（最大公约数//倒计时数组）：/有可能在代码示例中说明这一点吗？
h = h % 12
return (h == 5 && m >= 55) || (h == 6 && m <= 5)

function slideshow() {
    var screens = [
        "http://localhost:8084/test/screen1",
        "http://localhost:8084/test/screen2",
        "http://localhost:8084/test/screen3"
    ];
    var specialScreen = "http://localhost:8084/test/screen4";
    // Contains the index of currently shown screen or -1
    // when the special screen is shown
    var currentScreen = 0;
    // Cache the element here so we don't need to search for it every two seconds
    var show = $('#show');

    function timecondition() {
        var now = new Date();
        var h = now.getHours();
        var m = now.getMinutes();
        h = h % 12;
        return (h == 5 && m >= 55) || (h == 6 && m <= 5);
    }

    function update() {
        if (timecondition()) {
            if (currentScreen != -1) {
                show.load(specialScreen);
                currentScreen = -1;
            }
            return;
        }
        currentScreen = (currentScreen + 1) % screens.length;
        show.load(screens[currentScreen]);
    }
    setInterval(update, 2000);
}
$(document).ready(slideshow);

 function slideshow() {
    var screens = [
        {url: "http://localhost:8084/test/screen1", t: 2000},
        {url: "http://localhost:8084/test/screen2", t: 3000},
        {url: "http://localhost:8084/test/screen3", t: 10000}
    ];
    var specialScreen = "http://localhost:8084/test/screen4";
    // Contains the index of currently shown screen or -1
    // when the special screen is shown
    var currentScreen = 0;
    // Cache the element here so we don't need to search for it every two seconds
    var show = $('#show');

    function timecondition() {
        var now = new Date();
        var h = now.getHours();
        var m = now.getMinutes();
        h = h % 12;
        return (h == 5 && m >= 55) || (h == 6 && m <= 5);
    }

    var step = 1000;
    var screenTimer = 0;
    function update() {
        if (timecondition()) {
            if (currentScreen != -1) {
                show.load(specialScreen);
                currentScreen = -1;
            }
            return;
        }
        if ((screenTimer += step) >= screeens[currentScreen].t) {
            currentScreen = (currentScreen + 1) % screens.length;
            show.load(screens[currentScreen].url);
            screenTimer = 0;
        }
    }
    setInterval(update, step);
}
$(document).ready(slideshow);