Jquery easyui prompt模拟window.prompt使JS暂停

本文介绍了一种在用户长时间未操作后通过密码验证来保护重要功能的方法。利用jQuery EasyUI和Ajax同步请求实现了暂停程序执行直到用户正确输入密码的功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >


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;
			}
});  




评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值