jquery – 在等待ajax的响应时如何防止用户的交互

前端之家收集整理的这篇文章主要介绍了jquery – 在等待ajax的响应时如何防止用户的交互前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
场景如下:我正在使用 Jquery来实现一些ajax功能.例如:当用户单击“获取数据”按钮时,Jquery将调用.ajax函数从服务器获取一些数据.这个过程可能需要一些时间,所以我添加了.ajaxSend和.ajaxComplete函数显示等待进程的一些动画(实际上是一个带有z-index的div中的’Loading Data’gif:999是其中div的顶部).
在等待过程中(“加载数据”),我想阻止用户点击其他按钮(例如:我有其他标签,小’加载数据’gif下面的按钮).
我实现这一目标的方式是:
$("body").ajaxSend(function()
     {
        $(this).append('<div id="loading">Data Loading<\/div>');
        $("div#error").remove();
        $(this).children().not('#loading').css({'opacity':0.22});   
     });
    $("body").ajaxComplete(function()
     {
        $("div#loading").remove();
        $(this).children().not('#loading').css({'opacity':1});
     });

但是,我不认为改变不透明度是最好的方法.除非您将不透明度设置为0,否则用户仍然可以单击其他按钮/选项卡.我不知道在这个过程中如何完全避免任何用户交互?谢谢!!

解决方法

猜你在找的jQuery相关文章