数据库更改后使用 Javascript 重新加载页面

Posted 2023-02-22

【中文标题】数据库更改后使用 Javascript 重新加载页面

【英文标题】：Reload Page with Javascript after Database changes

【发布时间】：2014-11-01 10:14:06

【问题描述】：

我正在像这样显示来自数据库的表

<tr>
  <td> $user->id </td>
  <td> $user->... </td>
  <td> $user->... </td>
  <td> $user->... </td>
  <td> $user->... </td>
  <td> $user->... </td>
  <td> $user->... </td>
  <td> $user->... </td>
  <td> $user->... </td>
  <td> $user->... </td>
  <td> $user->... </td>
  <td></td>
</tr>

如果数据库发生更改，我必须在浏览器中按 F5 以显示更改。现在我想用 javascript 刷新页面，每次数据库中发生变化时。我不想按时间间隔刷新页面。 我有一个管理员可以更改某人的状态，您可以自己更改您的状态。当有人更改自己的状态时，管理员后端应该刷新。

你们对此有什么想法吗？

【问题讨论】：

如果您想要实时更新，那么您需要研究 websockets。

例如每 30 秒向服务器发送一次请求，脚本将检查是否有更新，向客户端返回答案并重新加载页面。你也可以看看长轮询github.com/panique/php-long-polling。

How to automatically reload a web page at a certain time?的可能重复

我对 Javascript 很陌生，所以 Websockets 对于初学者来说并不是那么理想，但感谢您的建议。我想我会尝试长轮询或短轮询方法。感谢您的回答！

【参考方案1】：

 // AJAX Request
            $.ajax(
                url: 'remove.php',
                type: 'POST',
                data:  id:id ,
                success: function(response)
    
                    if(response == 1)
                        // Remove row from html Table
                        $(el).closest('div').css('background','tomato');
                        $(el).closest('div').fadeOut(800,function()
                            $(this).remove();
                        );
                     location.reload();   
                    else
                        alert('Invalid ID.');

【讨论】：

正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。

【参考方案2】：

在一段时间后使用 ajax 从数据库中获取数据。

遍历您从数据库中获得的字段，并与页面中的当前字段进行比较。

如果您发现任何更改，请在前端使用您已获取的数据对其进行更新。

【参考方案3】：

我会使用非常原始的 API 来做到这一点。 jQuery（或 JS）向返回布尔值的 API url 发出请求，使用此布尔值，true 将触发刷新页面。 （或者甚至更好——不用 jQuery 改变内容而不刷新）这将是我的方法。

【参考方案4】：

最简单的方法（已经提到过）是每 x 秒重新加载一次页面。

这意味着，如果用户正在浏览/编辑页面上的任何内容，他只有 x 秒的时间来完成此操作，然后所有进度都将丢失。

您可以使用 AJAX 来检查数据库的更改：

制作一个输出最新数据库条目的 DB-Check.php 脚本 在您的主文件中，包含一个 AJAX 脚本，该脚本将 DB-Check.php 每 30 秒一次 将 DB-check.php 的输出放入一个新的 JS 变量中 如果新变量与旧变量不同，请刷新 整个页面（或使用 AJAX 加载数据库的其余部分）

【讨论】：

我假设您使用的是 PHP :) 当然它也应该适用于其他语言。

【参考方案5】：

location.reload();

这是重新加载当前页面的 javascript 函数。什么时候可以在js函数里面使用这个函数。

这个问题有点大，所以如果你想根据你的场景得到正确的答案，请描述你的详细场景。

您可能正在寻找这样的东西 How to automatically reload a web page at a certain time?

【参考方案6】：

最简单的解决方案是秒自动刷新页面。所以，请在头部添加这个：

<meta http-equiv="refresh" content="30" />

每 30 秒刷新一次。 其他方式是通过javascript：

setTimeout('window.location.reload();', 30000);

或

setTimeout('history.go(0);', 30000);

或

setTimeout("location.reload(true);", timeoutPeriod);

【讨论】：

我不想像我在问题中所说的那样在一段时间后刷新它。