页面加载时如何运行js获取数据？
Posted
技术标签:
【中文标题】页面加载时如何运行js获取数据？【英文标题】：How to run js to get data when page is loaded? 【发布时间】：2021-07-22 02:01:41 【问题描述】：我希望页面运行 form.js 并在页面加载时从 read.php 加载数据。每隔几秒自动刷新一次表格，而不是点击刷新按钮。这可能吗？我该如何做到这一点？
// index.html
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script type="text/javascript" src="/dashboard/form.js"></script>
</head>
<body>
<form action="read.php" method="POST">
<button type="submit" class="btn btn-primary">Refresh</button>
</form>
<table class="table" id="tableRefresh">
// table content
</table>
</body>
// form.js
$(document).ready(function ()
$("form").submit(function loadDetails (event)
$.ajax(
type: "POST",
url: "read.php",
dataType: "json",
).done(function (data)
console.log(data);
if (data.success)
$("#tableRefresh").html(
// edit table content
)
);
event.preventDefault();
);
);
【问题讨论】：
删除 【参考方案1】：您可以优化form.js代码文件以在指定的时间间隔自动获取/刷新数据，如下所示：
function loadData()
$.ajax(
type: "POST",
url: "read.php",
dataType: "json",
).done(function(data)
console.log(data);
if (data.success)
$("#tableRefresh").html(
// edit table content
)
);
$(document).ready(function()
setInterval(loadData, 10000); // refresh data every 10 secs
);
【讨论】：
以上是关于页面加载时如何运行js获取数据？的主要内容，如果未能解决你的问题，请参考以下文章
在初始页面加载时在 Next.js 中获取整个应用程序的全局数据
在页面加载完成后js获取table的高度不正确，刷新后获取的高度就正确了,求原因及解决方法。