Question

我一直在尝试创建一个简单的html文件，每隔几分钟就会切换两个其他html文件，但没有结果。

我的想法是，

我有两个html文件名'test1.html'和'test2.html'，然后我创建了一个名为'test.html'的第三个html文件，它将加载这两个html文件并在每分钟之间相互切换而不点击或者令人耳目一新。

我正在考虑使用JS编写一个函数来执行此操作但不知道如何执行此操作。

有没有人有任何例子？

提前谢谢你。

感谢各位回复提示和想法，经过多一点工作后，我想出了这个脚本来切换页面。

    var location1 = "test1.html";
    var location2 = "test2.html";

    function changePage() {

        var currentUrl = window.location.toString()

        if (currentUrl.includes(location2)){
            window.location.href=location1
            }
        else if (currentUrl.includes(location1)){
            window.location.href=location2
            }   
        else {
            window.location.href=location2
            }               
        };

    setInterval(changePage, 60000);

但是，例如，如果我在'test.html'中使用此功能，当切换页面时，地址也会改变，这意味着我必须在'test1.html'和'test2.html'中设置相同的功能所以它可以来回改变。

是否可以将网址始终保持为'test.html'，但页面内容是在'test1.html'和'test2.html'之间切换的？

感谢你。

Answer 1

您可以使用AJAX加载每个页面的HTML内容，而无需重新加载甚至导航离开您的test.html页面。

请检查此MDN Documentation for AJAX。

Answer 2

从高层次来看，这是您需要做的事情：1。通过AJAX请求获取两个文件的内容，或者包含在同一页面上但隐藏起来。 2.创建一个每分钟调用一次的JavaScript函数，该函数切换隐藏内容或发出AJAX请求。 3.你可以像这样递归地每分钟调用/执行你的逻辑 - setTimeout（myToggleFunction，60000）注意＆＃39; myToggleFunction＆＃39;应该递归调用myToggleFunction。

Answer 3

<script>
    setTimeout(function(){
       window.location='name.html';
    }, 5000);
</script>

Answer 4

在探索了不同的想法之后，我得到了一些这样的想法，

<script type="text/javascript" >    

    var monitorPage1 = "test1.html";
    var monitorPage2 = "test2.html";
    var timeInterval = 1000*60*2; //every 2 mins


   $.ajax({
        url: monitorPage1,
        success: function(data) {
        $('#monitorDiv').html(data);
            }
    }); 

    setTimeout( 
        function(){
            $.ajax({
                url: monitorPage2,
                success: function(data) {
                    $('#monitorDiv').html(data);
                    }
                }) 
            }, timeInterval);  

    function switchPages() {

    setTimeout( 
            function(){
                $.ajax({
                    url: monitorPage1,
                    success: function(data) {
                        $('#monitorDiv').html(data);
                        }
                    }) 
                }, 0);

        setTimeout( 
            function(){
                $.ajax({
                    url: monitorPage2,
                    success: function(data) {
                        $('#monitorDiv').html(data);
                        }
                    }) 
                }, timeInterval);  

            };

        setInterval(switchPages, timeInterval*2);

这可能不是最好的opiton，但它使用Ajax来读取html文件内容并且每2分钟来回切换一次。

谢谢大家的帮助。

每1分钟切换两个html文件

4 个答案: