Question

在jQuery中，有没有办法在执行每个Ajax帖子时自动屏蔽整个页面（以防止用户输入或双重提交......）？我看到这个插件：jQuery-blockUI（http://www.malsup.com/jquery/block/）但我们仍然需要为每个Ajax帖子手动屏蔽/取消屏蔽。
正如我在ExtJS中所知，我们可以通过实现“beforeAction”函数来控制它，因为这个事件将在表单上的任何操作之前被触发，但在jQuery中我没有发现类似的东西。
你能帮我解决一个问题吗？非常感谢你。

Answer 1

自己做这件事并不难。

<强> HTML

<body>
     <div id="mask"></div>
     <!-- Everything else -->
</body>

<强> CSS

#mask{
position:fixed;
width:100%;
height:100%;
background: /* You can make this slightly transparent black rgba(0,0,0,.3); or transparent */;
top:0;
left:0;
display:none;
}

<强> JAVASCRIPT

var isPageMasked = false,
    mask = $('#mask');

var maskPage = function(){

    if(isPageMasked){
        mask.hide();
    } else {
        mask.show();
    }

    isPageMasked = !isPageMasked;

};

然后，当你想要掩盖和取消屏蔽页面时，你只需要调用maskPage（）。

Answer 2

您可以使用beforeSend和完成功能

$.ajax({
  beforeSend: function() {
           //Mask page
    },
  complete: function(){
              //remove Mask
}
  }
});

执行jQuery post时屏蔽整个页面？

2 个答案: