gpt4 book ai didi

javascript - 立即启动 AJAX 请求但在添加元素之前确保页面已加载?

转载 作者:行者123 更新时间:2023-11-30 08:43:18 27 4
gpt4 key购买 nike

我发现在 <head> 期间提交 AJAX 请求我网页的一部分避免了页面加载时的微小闪烁(AJAX 加载的内容在加载时突然添加)。可以理解的是,当 AJAX 请求需要更长的时间时,这仍然需要改进以改善视觉外观,但在大多数情况下,这已经在访问者浏览器缓存中。

例子:

<!DOCTYPE html>
<html lang="en">
<head>
...

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$.get('{{jsonDataUrl}}', function(data) {
foo(data);
});
</script>

虽然这似乎表现得很好,但我担心 AJAX 响应可能会在页面加载完成之前返回。从概念上讲,我认为需要如下内容:

$.get('{{jsonDataUrl}}', function(data) {
// AJAX data received, wait until page has finished loading...
var id = setInterval(function() {
if (window.hasPageLoaded === true) {
clearInterval(id);
foo(data);
}
}, 0);
});

$(document).ready(function() {
window.hasPageLoaded = true;
});

在执行foo(data)之前,有没有更简单的方法来确保页面已经完成加载? ?

最佳答案

使用 promise :

var promise = $.get('{{jsonDataUrl}}');

$(function() {
promise.done(function(data) {
foo(data);
});
});

来自 jquery 文档:

This allows you to assign multiple callbacks on a single request, and even to assign callbacks after the request may have completed. (If the request is already complete, the callback is fired immediately.)

关于javascript - 立即启动 AJAX 请求但在添加元素之前确保页面已加载?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24275867/

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