在所有元素之上显示全屏不确定进度条

Question

我想在所有屏幕元素的顶部显示一个全屏不确定的进度条。我的用例如下：

向用户显示一个表单，其中包含电子邮件ID字段。用户输入电子邮件ID，并通过ajax将id与数据库匹配。当此操作正在进行并且正在等待通过ajax控制器的响应时，我希望在窗口的整个区域上显示全屏进度微调器，并且它必须具有文本“正在加载......”。在发生这种情况时，必须禁用所有其他控件。我希望将图像设置在所有控件之上。

验证完电子邮件后，我想隐藏该图片。

我在很多网站都看到了类似的效果。（此刻无法回忆）。 那么我该怎么办？（设置z-index对我不起作用）

编辑：

请参阅odesk.com的此屏幕截图。当您搜索作业并选中/取消选中左侧边栏中的类别时，将显示此进度条：

Answer 1

它是函数中的ajax调用吗？ ？如果是这样，在函数内部添加一个gif和text，那么当ajax完成时，它将输出到页面，覆盖gif。我有类似

的东西

function ajaxrequest() {
    var waitingimage="<img src='js/ajax-loader.gif'>";
    document.getElementById('ajax_results').innerHTML =waitingimage;

然后在最后覆盖它

if (xhr.status == 200 && xhr.status < 300) {        
document.    getElementById         ('ajax_results').innerHTML = xhr.responseText;