gpt4 book ai didi

jquery-ui - $.Ajax 使用 jquery 发送进度条

转载 作者:行者123 更新时间:2023-12-01 08:25:16 25 4
gpt4 key购买 nike

大家好
我使用 $.ajax 功能将数据发送到服务器,通过这种方法,我删除了大部分回发页面,它可以工作,但我需要一些进度条来向访问者显示有一些进展,现在它在显示结果几秒钟后什么也没有显示,但我认为我的网站需要留言或小图片。我如何用简单的 jquery 代码来实现它?弹出一些内容并显示页面正在进行中。

而且我还需要添加一些其他 jquery 以防止在进度期间发生其他点击,这可能吗?

最佳答案

你可以做类似的事情

$("elemnt").click(function(){
$("loader-img").show();

$.ajax({
url : "your url",
complete: function(){
$("loader-img").hide();
}
});
});

加载器图像可以是页面阻塞 div,以阻止用户对视口(viewport)中心的图像执行任何操作。

这里使用了complete事件,因为在成功/失败的ajax请求的情况下会调用该事件。

已编辑你可以做类似的事情

<style type="text/css">
.blocker{
z-index: 99999;
opacity: .5;
height: 100px;
position: fixed;
background: none repeat scroll 0 0 lightgrey;
width: 100%;
}

.blocker .img{
position: fixed;
color: red;
}
</style>

<body>
<div class="blocker" style="display: none">
<div class="img">img</div>
</div>
.............
.............
.............

然后在脚本中

function showBlocker(){
$(".blocker .img").css({
top: $(window).height() / 2,
left: $(window).width() / 2
});
$(".blocker").show().css({
height: $(document).height()
});
}

然后调用 showBlocker() 方法来显示拦截器。

您可以调整答案以满足您的需要。这只是一个如何实现的示例

关于jquery-ui - $.Ajax 使用 jquery 发送进度条,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4516396/

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