我正在尝试制作一个几乎实时显示两个数据库中的数据的页面。我遇到的问题是 JQuery Ajax 调用仅更改 html 一次
HTML 代码:
<div class="database">
<h1>Trying to connect...</h1>
<script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
$(".database").each(function update()
{
var self = this;
var i = 0;
$.ajax(
{
url: "/show",
method: 'GET',
cache: false,
success: function (data) {
$(self).html(data);
console.log(data);
}
}
)
setTimeout(update, 10000);
});
update();
</script>
</div>
在 /show 上运行的 PHP 代码
try
{
$SosAlerts = DB::connection('MSSQLSERVER01')->select('select TOP(10) * from SosAlert ORDER BY date_time DESC');
echo "<h3>MSSQLSERVER01</h3>
<table>
<tr>
<th>SosAlertID</th>
<th>XCoordinate</th>
<th>YCoordinate</th>
<th>Date And Time</th>
</tr>";
foreach ($SosAlerts as $sosAlert) {
echo "<tr>
<td> " . $sosAlert->SosAlertID . "</td>
<td>" . $sosAlert->XCoordinate . "</td>
<td>" . $sosAlert->ZCoordinate . "</td>
<td>" . $sosAlert->date_time . "</td>
</tr>";
}
问题是,第一次调用时只$(self).html(data)更新一次 html 内容,之后就不再改变了。显示每 10 秒进行一次 ajax 调用,并且在更新数据库时正确更改数据。即我运行 HTML 页面,它显示尝试连接...,之后它更改为显示 10 行的表,并且控制台日志中显示相同的内容,在接下来的 10 秒内我在数据库中插入新行,重复调用,控制台日志转储数据时显示新行,但 html 未更改<div class="database">console.log(data)
慕村225694