在输入AJAX时获得不闪烁的加载div,可以通过以下步骤实现:
以下是一个示例代码:
HTML:
<div id="loadingDiv">Loading...</div>
CSS:
#loadingDiv {
display: none;
/* 设置加载div的样式和位置 */
}
JavaScript:
function showLoadingDiv() {
var loadingDiv = document.getElementById("loadingDiv");
loadingDiv.style.display = "block";
}
function hideLoadingDiv() {
var loadingDiv = document.getElementById("loadingDiv");
loadingDiv.style.display = "none";
}
function makeAjaxRequest() {
showLoadingDiv();
// 发送AJAX请求
var xhr = new XMLHttpRequest();
xhr.open("GET", "your-api-endpoint", true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// 处理AJAX响应
hideLoadingDiv();
// 更新页面内容或执行其他操作
}
};
xhr.send();
}
在上述示例中,通过showLoadingDiv()函数显示加载div,通过hideLoadingDiv()函数隐藏加载div。在makeAjaxRequest()函数中发送AJAX请求,并在请求完成后隐藏加载div。你可以根据实际情况修改代码以适应你的应用场景。
腾讯云相关产品和产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云