如何等待阿贾克斯的反应时,prevent用户的互动 [英] how to prevent users' interaction when waiting for ajax's response

查看:62
本文介绍了如何等待阿贾克斯的反应时,prevent用户的互动的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

该方案是这样的:我使用jQuery来实现一些Ajax特性。例如:当用户点击一个按钮获取数据,jQuery将调用阿贾克斯函数来从服务器获取一些数据。这个过程可能需要一些时间,所以我加了.ajaxSend和.ajaxComplete功能表现出一定的动画等待进程(实际上是一个读取数据用z-index一个div里的gif:999在里面其他的div的顶部)。 在等待的过程中(在加载数据),我想prevent用户点击其它按钮(例如:我有其他选项卡,下面的小加载数据GIF按钮)。 我做到了这一点的方法是:

The scenario is like: I'm using Jquery to implement some ajax features. For example: when a user click a button "get data", Jquery will call .ajax function to fetch some data from the server. This process might take some time, so I added .ajaxSend and .ajaxComplete functions to show some animation for the waiting process (actually a 'Loading Data' gif inside a div with z-index: 999 to be the top of other divs inside the ). During the waiting process (the 'Loading Data'), I would like to prevent users to click other buttons (for example: I have other tabs, buttons below the small 'Loading Data' gif). The way I achieved this is by:

    $("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,用户仍然可以通过点击其他按钮/标签。我不知道如何完全避免在此过程中的任何用户交互?谢谢!

However, I don't think changing the opacity is the best way. Unless you make the opacity to 0, users can still click on other buttons/tabs. I don't know how to totally avoid any user interactions during this process? Thanks!!

推荐答案

使用的叠加。

http://jqueryui.com/demos/dialog/#modal

这篇关于如何等待阿贾克斯的反应时,prevent用户的互动的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆