smz_94 2021-03-16 15:22 采纳率: 100%
浏览 139
已采纳

js函数执行过程中操作元素怎样才能实时生效?

前端小白求教,在页面点击按钮后执行两个ajax请求时,为了避免页面就此呆住,想在执行ajax的时候置灰按钮,同时显示进度条,结束以后隐藏进度条,重置按钮可用,于是写成了如下这样。

测试时发现ajax之前的操作完全没有生效,只打印了alert的内容,整个函数跑完后,才会执行最后两句,求教,请问是这样写有问题吗?正确写法应该是怎样的?浏览器是safari

$("#btn").click(function(){
	$("#progressbar").show();
	$("#btn").attr("disabled",true);
	alert("11");
	$.ajax({
	 	async:false,
	       ...
	}); 
	$.ajax({
		 async:false,
	       ...
	});
	$("#progressbar").hide();
	$("#btn").attr("disabled",false);
	alert("22");
})
  • 写回答

4条回答 默认 最新

  • 意绮行 2021-03-16 15:38
    关注

    很久以做过Web开发,   对于JS来说,真正刷新UI是本次事件结束之后浏览器才做渲染处理,你上面的代码由于使用同步方式进行网络请求,因此本次事件一直被ajax阻塞,在之前的UI逻辑虽然调用了但没有被浏览器进行渲染。你如果要做的话,可以在click中进行UI逻辑处理显示xx之后,调用timeoutfunction(ajaxXXX,0)使用下一次的事件触发来进行ajax请求并在请求成功后隐藏UI。 这样应该能满足你的需要。

     

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

悬赏问题

  • ¥15 想问一下stata17中这段代码哪里有问题呀
  • ¥15 flink cdc无法实时同步mysql数据
  • ¥100 有人会搭建GPT-J-6B框架吗?有偿
  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决