Jquery easyui prompt还有extjs的prompt都是模拟的一个div装进一个window
这种控件是不可能使JS暂停的,就是说弹出窗口点击确定之前下面的流程会继续运行而不会停止。
这次项目里面有个需求是页面某个重要的按钮,如果用户在一定时间之内没有操作那么就需要输入密码才能继续操作,
所以必须要弹出密码框,输入正确才能继续操作,使用window.prompt可以解决,但是页面上太丑了,没法用在项目上面。
在网上查了下,发现下面这个函数可以实现按照顺序来执行2个方法
function doCallback(fn,args){
fn.apply(this, args);
}
下面是符合本次需求的程序:
//更新session最后操作时间
function doCallbackUpdate(fn,args){
$.ajax({
url: contextPath+"/monitor/updateSessionTime",
type:"post",
async:false,//设置同步
success:function(data){
doCallback(fn,args);
}
});
}
//弹出prompt主方法
function handOperte(fn,args){
$.ajax({
url: contextPath+"/monitor/checkLastOperateTime",
type:"post",
async:false,//设置同步
success:function(data){
if(data == "1"){
$.messager.prompt('提示:由于长时间没操作','请输入密码:',function(r){
if(r){
$.ajax({
url: contextPath+"/monitor/checkPassword",
type:"post",
data: "password="+r,
async:false,//设置同步
success:function(data){
if(data=="1"){
jQuery.messager.alert('提示:',"密码输入错误!请重新输入!","info");
}else{
doCallbackUpdate(fn,args);
}
}
});
}else{
if(r==""){
jQuery.messager.alert('提示:',"请输入密码!","info");
}
}
},'password');
}else{
doCallback(fn,args);
}
}
});
}
然后再需要调用的地方使用handOperte(fn,args)这个方法fn为函数名 args为函数的参数,多个参数用数组来代替
比如一个添加按钮有个add()方法 那么这个就换成handOperte(add,[])
如果add(val1,val2)带了参数则为handOperte(add,[val1,val2])
参数最好使用字符串 不要使用数组和对象
另外:
Jquery easyui prompt的输入框是明文的,可以做如下修改为密文:
$.extend($.messager, {
prompt : function(_1c, msg, fn, type) {
var _t = 'text';
if(type != 'undefined' && type == 'password'){
_t = 'password';
}
var _1d = "<div class=\"messager-icon messager-question\"></div>"
+ "<div>"
+ msg
+ "</div>"
+ "<br/>"
+ "<div style=\"clear:both;\"/>"
+ "<div><input class=\"messager-input\" type=\""+_t+"\"/></div>";
var _1e = {};
_1e[$.messager.defaults.ok] = function() {
win.window("close");
if (fn) {
fn($(".messager-input", win).val());
return false;
}
};
_1e[$.messager.defaults.cancel] = function() {
win.window("close");
if (fn) {
fn();
return false;
}
};
var win = _f(_1c, _1d, _1e);
win.children("input.messager-input").focus();
return win;
}
});