如果内容不同，则使用 ajax 更新页面

Updating a page using ajax if the content differs

本文关键字：ajax 更新 如果      更新时间：2023-09-26

我正在尝试创建一个投票应用程序，我需要一些帮助。

我

遇到的问题是，我每 3 秒发送一次请求，并且在每次重新加载时表单中选择的所有选项都会重置。（因此，用户必须做出选择并在 3 秒内提交。

<script type="text/javascript">
    $(document).ready(function() {
        $.ajaxSetup({ cache: false });
        setInterval(function() {
            $('#respnseDiv').load('response.php');
        }, 3000);
    });
</script>

这是我目前用来填充div

我希望jQuery检查每个响应的内容，看看是否与上一个相同，如果是，请不要更新div，如果内容不同（即要投票的新问题），请将其加载到div中。

我不太擅长js/jquery，但渴望学习

问候

Johan

你可以添加一个叫做"id"的隐藏输入（即包含问题的id）或其他东西到你的div，然后创建另一个（隐藏的）div，ajax将响应加载到其中。只需比较"id"输入的值，如果它们不匹配，那么您实际上可以将 html 加载到原始div 中。喜欢这个：

$(document).ready(function () {
        $.ajaxSetup({ cache: false });
        setInterval(function () {
            $('#hiddenDiv').load('response.php');
            if ($("#hiddenDiv input.id").val() != $('#respnseDiv input.id').val())
            {
                $('#respnseDiv').html($('#hiddenDiv').html());
            }               
        }, 3000);
    });

在 mysql 表中使用时间戳，然后创建另一个 php 文件以检查具有条件的最新时间戳。 检查此时间戳并将最新数据库更新的时间戳保存在 JavaScript 变量中。

var latest_timestamp = 0;
setInterval(function () {
    $.ajax({
        url: "check_timestamp.php",
        type: "GET",
        success: function(latest_db_timestamp){
            if(latest_timestamp < latest_db_timestamp)
            {
                $('#respnseDiv').load('response.php');
            }
        }
    });
}, 3000);

使用全局变量将每个响应与最后一个响应进行比较，并仅在存在差异时才修改 html。

给你：

<script type="text/javascript">
    var last_response = null;
    $(document).ready(function() {
        $.ajaxSetup({ cache: false });
        setInterval(function() {
            var res = $.get('response.php');
            if (res != last_response) {
                $('#respnseDiv').html(res);
                last_response = res;
            }
        }, 3000);
    });
</script>

希望有帮助。

相关文章：