gpt4 book ai didi

javascript - JS,json数据改变时如何刷新页面或div?

转载 作者:行者123 更新时间:2023-11-28 02:49:08 26 4
gpt4 key购买 nike

你好,我启动了 javascript,我正在制作一个动态的 ajax GET 页面,(当 json 数据改变时刷新页面等)。

我的问题是当数据改变时我需要刷新页面或容器 div这是我的代码HTML:

<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Refresh" content="600">
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<body>
<div id="container">
<div id="event"></div>
<div id="counter">
<span id="countdown"></span>
</div>
</div>
<script type="text/javascript" src="jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="custom.js"></script>
</body>
</html>

JS:

var request = $.ajax({
url: "data.php",
type: "GET",
dataType: "json"

}).done(function (data) {
var write = '<img src="' + data.img + '">';
$("#event").html(write);
$("#event").delay(data.countdown * 1000).fadeOut();
var i = data.countdown;
var fade_out = function () {
$("#counter").fadeOut().empty();
clearInterval(counter);
};
setTimeout(fade_out, data.countdown * 1000);
function count() { $("#countdown").html(i--); }
var counter = setInterval(function () { count(); }, 1000);
});

JSon是这样的

{"img":"img\/maltolmeca.jpg","countdown":"60"}

最佳答案

在当今时代,您可能值得研究一下 Angular、React 和 Vuejs 等为您处理“数据刷新”的库。

无论如何,在您的 done() 函数中,您只需调用 location.reload() 即可刷新页面。

...虽然我认为这不是您实际想要实现的目标。像这样刷新页面通常是一种糟糕的用户体验,所以让我们尝试一个更好的解决方案。

“重新加载”div 的一种方法是执行如下操作:

if (data.success){
$("#event").fadeOut(800, function(){
$("#event").html(msg).fadeIn().delay(2000);
});
}

甚至

$("#event").load("#event");

关于javascript - JS,json数据改变时如何刷新页面或div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46756208/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com