Question

我有以下代码设置：（对于uni项目）。

本质上，Books Store.php旨在每5分钟更新和显示一本书的列表。

// Book Store.php
<head>
    <script 
src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> 
</script>
</head>
</body>
    <div class = "container-fluid">
    <div id = "Books"></div>
</body>
<script>
    $(document).ready(function () {
        Books();
        setInterval(Books, 300000);
        $.ajaxSetup({cache: true});
    });
    function Books() {
        $("#Books").load("php/Books.php");
    }
</script>

然后，Books.php将每30秒更新和显示一本Book Pages列表。

// Books.php
// Get List of books from MySQL

// FOR EACH BOOK .....
<div id = "BookPages"></div>

<script>
    $(document).ready(function () {
        BookPages();
        setInterval(BookPages, 30000);
        $.ajaxSetup({cache: true});
    });
    function BookPages() {
        $("#BookPages").load("php/BookPages.php");
    }
</script>
//  CLOSE FOR LOOP

首先加载页面，一切正常，直到BooksStore.php尝试重新加载图书列表。发生的情况是Books.php将正确重新加载，而BooksPages.php将重新加载多次。

BookStore第2次重新加载-Books.php将重新加载BooksPages.php 2次。

BookStore第3次重新加载-Books.php将重新加载BooksPages.php 6次。

BookStore第4次重新加载-Books.php将重新加载BooksPages.php 8次。

BookStore第5次重新加载-Books.php将重新加载BooksPages.php 12次。

依次类推，直到服务器开始变慢并耗尽资源为止。为什么会这样/如何解决。

谢谢，

Answer 1

就像@Zim说的那样，请尝试使用 clearInterval（）检查您的代码是否现在可以按预期工作：

BookStore.php

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>

<body>
    <div class="container-fluid">
        <div id="Books"></div>
    </div>

    <script>
        var int1;

        $(document).ready(function()
        {
            if (int1)
                clearInterval(int1);

            Books();
            int1 = setInterval(Books, 300000);
            $.ajaxSetup({cache: true});
        });

        function Books()
        {
            $("#Books").load("php/Books.php");
        }    
    </script>
</body>

Books.php

<div id="BookPages"></div>

<script>
    var int2;

    $(document).ready(function()
    {
        if (int2)
            clearInterval(int2);

        BookPages();
        int2 = setInterval(BookPages, 30000);
        $.ajaxSetup({cache: true});
    });

    function BookPages()
    {
        $("#BookPages").load("php/BookPages.php");
    }
</script>

Answer 2

实际上，Store.php每5分钟初始化一次Books（）函数的调用。因此，除非每次使用功能BookPages清除前一个时间表，否则每次都会为clearInterval()创建一个新时间表。因此，在调用Books()函数之前，您应该清除BookPages()的时间表。

您可以通过以下链接了解clearInterval()的用法：clearInterval w3schools

Answer 3

setInterval（）将继续调用一个函数，直到清除为止，使用setTimeout（）仅执行一次。

setTimeout(BookPages, 30000);

Answer 4

通过在上一个请求之后重新启动下一个ajax调用，页面将每30秒更新一次。

    function BookPages() {
        $.ajax({
            url: 'BookPages.php',
            success: function(data) {
                $('.result').html(data);
            },
            complete: function() {
                window.setTimeout(BookPages, 30000);
            }
        });
    }

window.setTimeout(BookPage,

 30000);

使用JQuery刷新页面过多

4 个答案: