C#程序执行时设置刷新等待

背景

C#在进行某些调用操作时需要隐藏背景，等待刷新。

步骤

1、前端设置

<!--Loading Mask Region-->
<div>
<div id="divMaskFrame" style="background-color: #F2F4F7; display: none; position: absolute;
left: 0px; top: 0px;">
</div>
<div id="divProgress" style="text-align: center; display: none; position: fixed;
top: 50%; left: 50%;">
<asp:Image ID="imgLoading" runat="server" ImageUrl="../Resources/Images/LoadingMask.gif" />
</div>
</div>

2、JS代码

<script type="text/javascript">
// Loading Mask function
// ref: https://dotblogs.com.tw/joysdw12/archive/2012/12/13/85629.aspx

function RotateAnimation(obj) {
var $this = $(obj);
$this.button('loading');
setTimeout(function () {
$this.button('reset');
}, 2500);
}

// 顯示讀取遮罩
function ShowProgressBar() {
// Need to setTimeout to delay for IE Browser
setTimeout(function () {
displayProgress();
displayMaskFrame();
}, 300);
}
// 隱藏讀取遮罩
function HideProgressBar() {
var progress = $('#divProgress');
var maskFrame = $("#divMaskFrame");
progress.hide();
maskFrame.hide();
}
// 顯示讀取畫面
function displayProgress() {
var w = $(document).width();
var h = $(window).height(); // 若取 document 的位置會跑掉
var progress = $('#divProgress');
progress.css({ "z-index": 999, "top": (h / 2) - (progress.height() / 2), "left": (w / 2) - (progress.width() / 2) });
progress.show();
}
// 顯示遮罩畫面
function displayMaskFrame() {
var w = $(window).width();
var h = $(document).height();
var maskFrame = $("#divMaskFrame");
maskFrame.css({ "z-index": 998, "opacity": 0.8, "width": w, "height": h });
maskFrame.show();
}
</script>

3、使用方法

OnClientClick="RotateAnimation(this); return ShowProgressBar();"