Js lock screen

Jquery plug-in source code:

/**
* Encapsulate $. ajax in jquery to add the lock screen function.
* Whether isAsync is an asynchronous request. The default value is true.
* Whether isLock is locked. The default value is true.
* Whether isCache loads information from the browser cache. The default value is fasle.
***/
; (Function ($ ){
$. Fn. doPost = function (settings ){
Settings = jQuery. extend ({
IsAsync: true,
Type: "post ",
Url: null,
DataType: null,
Data: null,
Success: null,
Error: toError,
IsLock: true,
IsCache: false
}, Settings );
$ (This). each (function (){
If (settings. isLock ){
LockSrc ();
}
$. Ajax ({
Async: settings. isAsync,
Type: settings. type,
Url: settings. url,
DataType: settings. dataType,
Data: settings. data,
Cache: settings. isCache,
Success: function (msg ){
If (settings. isLock ){
UnlockSrc ();
}
Settings. success (msg );
},
Error: settings. error
});
});

// Screen lock Method
Function lockSrc (){
$ (". LockDiv" mirror.css ({"opacity": "0.5"}). fadeIn ('normal ');
Var scrollWidth = document.doc umentElement. clientWidth; // document. body. clientWidth;
Var scrollHeight upload document.doc umentElement. clientHeight; // document. body. clientHeight;
Var divWidth = $ (". lockDivInfo"). width ();
Var divHeight = $ (". lockDivInfo"). height ();
Var divLeft = scrollWidth/2-divWidth/2;
Var divTop = scrollHeight/2-divHeight/2;
// Console. log ("bodyWidth =" + scrollWidth + ", bodyHeight =" + scrollHeight + ", divHeight =" + divHeight + ", divWidth =" + divWidth + ", left = "+ divLeft +", top = "+ divTop );
$ (". LockDivInfo" ).css ({"position": "absolute", "top": divTop, "left": divLeft}). fadeIn ('normal ');
}
// Solution Method
Function unlockSrc (){
$ (". LockDivInfo"). fadeOut ('normal ');
$ (". LockDiv"). fadeOut ('normal ');
}
Function toError (){
Alert ("operation failed! ");
}
};
}) (JQuery );

Lock screen style:

/*
Lock Screen
*/

. LockDiv {
Width: 100%;
Height: 100%;
Display: none;
Z-index: 10;
Background-color: # DFE8F6;
Position: absolute;
Top: 0px;
Left: 0px;
}
. LockDivInfo {
Width: 50px;
Height: 2px;
Display: none;
Position: absolute;
Left: 0px;
Top: 0px;
Z-index: 11
}
# CloseDiv {
Float: right;
Width: 100px;
Height: 100px;
Margin-top: 10px;
Margin-right: 10px;
}

Usage

// Query
$ ("# QueryBtn"). click (function (){
SelecCheckByRegionApp. query ();
});

Var selecCheckByRegionApp = {};
SelecCheckByRegionApp. query = function (){
Var settion = {
Type: "post ",
Url: 'selfcheckstatisticaction! FindByRegion ',
DataType: "text ",
Data: $ ("# searchForm"). formSerialize (),
Success: function (msg ){
$ ("# ContentDiv" cmd.html (msg );
}
};
$ ("# QueryBtn"). doPost (settion );
}