小编典典

jQuery-如何禁用整个页面

css

我有这个ajax事件

function save_response_with_ajax(t){
  var form = $('#edit_'+t);
  var div = $('#loading_'+t);
  $.ajax({
    url: form.attr("action"), 
    type: "POST",    
    data: form.serialize(), 
    cache: false,
    beforeSend: function(){
      form.hide();
      div.show();
    },
    complete: function(){
      div.hide();
      form.show();
    },
    success: function (result) {
    }       
  });
}

一切正常,但我想添加(如果可能)在ajax事件发生之前/完成时将整个页面(内容/正文)变成灰色的功能,就像它是模态的但没有对话框)

有办法吗?

提前致谢


阅读 948

收藏
2020-05-16

共1个答案

小编典典

一种方法是使用覆盖整个页面的overlay元素。如果overlay元素具有半透明的背景色,它将完全使页面变灰

给予较高的评价z-index,使其位于所有其他元素之上。这样,它可以正确渲染,并且可以捕获所有事件(并且不会通过它们)。

#overlay {
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 999;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: none;
}​
2020-05-16