模态窗口下计时器停止问题(高分送出) javascript 打开模态窗口,使用setTimeout 或者setInterval设计的计时器,在鼠标点击右上角关闭窗口按钮时(注意只是按下),计时器自动停止工作,移开鼠标并松开后计数器继续运行。问题: 如何在鼠标按住【关闭】窗口按钮时不影响计时器工作?(请注意在普通窗口下不存在此问题,此问题只存在于模态或非模态窗口!) 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 可以用JS做 捕捉鼠标的按下事件和释放事件。 至于说的离开那个X 可以获得X的坐标的(最大化)请注意在普通窗口下不存在此问题,此问题只存在于模态或非模态窗口!) 这点有点麻烦哦 CalvinDo ,谢谢在模态窗口下 关闭窗口鼠标按下事件是无法捕获的。另外计时器停止问题无法有效解决 g.cn搜不到一点有价值的信息吗? 自己写一个弹出窗口的JS,之前我也遇到过<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>MessageBox演示</title><script language="javascript">/**//******************************************************************************************* * 下面的内容可以拷贝到一个JS文件里面*********************************************************************************************/// 控制按钮常量var MB_OK = 0;var MB_CANCEL = 1;var MB_OKCANCEL = 2;var MB_YES = 3;var MB_NO = 4;var MB_YESNO = 5;var MB_YESNOCANCEL = 6;// 控制按钮文本var MB_OK_TEXT = "确定";var MB_CANCEL_TEXT = "取消";var MB_YES_TEXT = " 是 ";var MB_NO_TEXT = " 否 ";//提示图标var MB_ICON = "http://2lin.net/image/information.gif";//委托方法var MB_OK_METHOD = null;var MB_CANCEL_METHOD = null;var MB_YES_METHOD = null;var MB_NO_METHOD = null;var MB_BACKCALL = null;var MB_STR = '<style type="text/css"><!--' +'body{margin:0px;}' +'.msgbox_title{background-color: #B1CDF3;height:25px;position:relative;font-size:14px;line-height:25px;padding-left:10px;border-bottom:1px solid #000;}' +'.msgbox_control{text-align:center;clear:both;height:28px;}' +'.msgbox_button{background-color: #B1CDF3;border:1px solid #003366;font-size:12px;line-height:20px;height:21px;}' +'.msgbox_content{padding:10px;float:left;line-height: 20px;}' +'.msgbox_icon{width: 50px;height: 50px;float: left;text-align: center;line-height:50px;padding-top:10px;}' +'.msgbox_mask{position:absolute;left:0px;top:0px;z-index:99999;background-color:#333333;width:100%;height:100%;}' +'.msgbox{background-color: #EFFAFE;position: absolute;height:auto;font-size:12px;top:50%;left:50%;border:1px solid #999999;}' +'--></style>' +'<div id="msgBoxMask" class="msgbox_mask" style="filter: alpha(opacity=0);display:none;"></div>' +'<div class="msgbox" style="display:none; z-index:100000;" id="msgBox">' +'<div class="msgbox_title" id="msgBoxTitle"></div>' +'<div class="msgbox_icon" id="msgBoxIcon"></div>' +'<div class="msgbox_content" id="msgBoxContent"></div>' +'<div class="msgbox_control" id="msgBoxControl"></div></div>';var Timer = null;document.write(MB_STR);var icon = new Image();icon.src = MB_ICON;/**//* 提示对话框* 参数 1 : 提示内容* 参数 2 : 提示标题* 参数 3 : 图标路径* 参数 4 : 按钮类型*/function MessageBox(){var _content = arguments[0] || "这是一个对话框!";var _title = arguments[1] || "提示";var _icon = arguments[2] || MB_ICON;var _button = arguments[3] || MB_OK;MB_BACKCALL = arguments[4];var _iconStr = '<img src="{0}">';var _btnStr = '<input name="{0}" id="{0}" type="button" class="msgbox_button" value="{1}" onclick="MBMethod(this)" />';switch(_button){ case MB_CANCEL : _btnStr = _btnStr.toFormatString("msgBoxBtnCancel", MB_CANCEL_TEXT); break;case MB_YES : _btnStr = _btnStr.toFormatString("msgBoxBtnYes", MB_YES_TEXT); break;case MB_NO : _btnStr = _btnStr.toFormatString("msgBoxBtnNo", MB_NO_TEXT); break;case MB_OKCANCEL : _btnStr = _btnStr.toFormatString("msgBoxBtnOk", MB_OK_TEXT) + " " +_btnStr.toFormatString("msgBoxBtnCancel", MB_CANCEL_TEXT); break;case MB_YESNO :_btnStr = _btnStr.toFormatString("msgBoxBtnYes", MB_YES_TEXT) + " " +_btnStr.toFormatString("msgBoxBtnNo", MB_NO_TEXT); break;case MB_YESNOCANCEL :_btnStr = _btnStr.toFormatString("msgBoxBtnYes", MB_YES_TEXT) + " " +_btnStr.toFormatString("msgBoxBtnNo", MB_NO_TEXT) + " " +_btnStr.toFormatString("msgBoxBtnCancel", MB_CANCEL_TEXT); break;default : _btnStr = _btnStr.toFormatString("msgBoxBtnOk", MB_OK_TEXT); break; }//解决 FF 下会复位ScrollTop = GetBrowserDocument().scrollTop; ScrollLeft = GetBrowserDocument().scrollLeft; GetBrowserDocument().style.overflow = "hidden";GetBrowserDocument().scrollTop = ScrollTop; GetBrowserDocument().scrollLeft = ScrollLeft; $("msgBoxTitle").innerHTML = _title;$("msgBoxIcon").innerHTML = _iconStr.toFormatString(_icon);$("msgBoxContent").innerHTML = _content; $("msgBoxControl").innerHTML = _btnStr;OpacityValue = 0;$("msgBox").style.display = ""; try{$("msgBoxMask").filters("alpha").opacity = 0;}catch(e){};$("msgBoxMask").style.opacity = 0;$("msgBoxMask").style.display = "";$("msgBoxMask").style.height = GetBrowserDocument().scrollHeight + "px";$("msgBoxMask").style.width = GetBrowserDocument().scrollWidth + "px";Timer = setInterval("DoAlpha()",1);//设置位置 $("msgBox").style.width = "100%"; $("msgBox").style.width = ($("msgBoxIcon").offsetWidth + $("msgBoxContent").offsetWidth + 2) + "px";$("msgBox").style.marginTop = (-$("msgBox").offsetHeight/2 + GetBrowserDocument().scrollTop) + "px";$("msgBox").style.marginLeft = (-$("msgBox").offsetWidth/2 + GetBrowserDocument().scrollLeft) + "px"; if(_button == MB_OK || _button == MB_OKCANCEL){$("msgBoxBtnOk").focus();}else if(_button == MB_YES || _button == MB_YESNO || _button == MB_YESNOCANCEL){$("msgBoxBtnYes").focus();} }var OpacityValue = 0;var ScrollTop = 0;var ScrollLeft = 0;function GetBrowserDocument(){var _dcw = document.documentElement.clientHeight;var _dow = document.documentElement.offsetHeight;var _bcw = document.body.clientHeight;var _bow = document.body.offsetHeight;if(_dcw == 0) return document.body;if(_dcw == _dow) return document.documentElement;if(_bcw == _bow && _dcw != 0) return document.documentElement;elsereturn document.body;}function SetOpacity(obj,opacity){if(opacity >=1 ) opacity = opacity / 100; try{obj.style.opacity = opacity; }catch(e){}try{ if(obj.filters){obj.filters("alpha").opacity = opacity * 100;}}catch(e){}}function DoAlpha(){if (OpacityValue > 20){clearInterval(Timer);return 0;}OpacityValue += 5; SetOpacity($("msgBoxMask"),OpacityValue);}function MBMethod(obj){ switch(obj.id){case "msgBoxBtnOk" : if(MB_BACKCALL) {MB_BACKCALL(MB_OK);} else {if(MB_OK_METHOD) MB_OK_METHOD();} break;case "msgBoxBtnCancel" : if(MB_BACKCALL) {MB_BACKCALL(MB_CANCEL);} else {if(MB_CANCEL_METHOD) MB_CANCEL_METHOD();} break;case "msgBoxBtnYes" : if(MB_BACKCALL) {MB_BACKCALL(MB_YES);} else {if(MB_YES_METHOD) MB_YES_METHOD();} break;case "msgBoxBtnNo" : if(MB_BACKCALL) {MB_BACKCALL(MB_NO);} else {if(MB_NO_METHOD) MB_NO_METHOD();} break;} MB_OK_METHOD = null;MB_CANCEL_METHOD = null;MB_YES_METHOD = null;MB_NO_METHOD = null;MB_BACKCALL = null;MB_OK_TEXT = "确定";MB_CANCEL_TEXT = "取消";MB_YES_TEXT = " 是 ";MB_NO_TEXT = " 否 ";$("msgBox").style.display = "none"; $("msgBoxMask").style.display = "none"; GetBrowserDocument().style.overflow = ""; GetBrowserDocument().scrollTop = ScrollTop;GetBrowserDocument().scrollLeft = ScrollLeft; }String.prototype.toFormatString = function(){ var _str = this;for(var i = 0; i < arguments.length; i++){ _str = eval("_str.replace(/\\{"+ i +"\\}/ig,'" + arguments[i] + "')");}return _str;}function $(obj){return document.getElementById(obj);}/**////////////////////////////////////////////////////////////////////////////////////////</script><script language="javascript">function test(){var _msg = "<font color=red><b>演示:</b></font><br/>普通对话框!";MessageBox(_msg);}function test1(){MB_OK_METHOD = function(){alert('你按了OK');}MB_YES_METHOD = function(){alert('你按了YES');}MB_NO_METHOD = function(){alert('你按了NO');}MB_CANCEL_METHOD = function(){alert('你按了CANCEL');} var _msg = "<font color=red><b>演示:</b></font><br/>调用对话框。是、否、取消";MessageBox(_msg,"演示",null,MB_YESNOCANCEL); }function test2(){ var _msg = "<font color=red><b>演示:</b></font><br/>调用对话框。是、否、取消";MessageBox(_msg,"演示",MB_ICON,MB_YESNOCANCEL,callback);}function test4(){ var _msg = "<font color=red><b>演示:</b></font><br/>调用对话框。确定、取消";MessageBox(_msg,"演示",MB_ICON,MB_OKCANCEL,callback);}function callback(value){switch(value){case MB_OK : alert('你按了OK'); break;case MB_YES : alert('你按了YES'); break;case MB_NO : alert('你按了NO'); break;case MB_CANCEL : alert('你按了CANCEL'); break;}}function test3(){ MB_YES_TEXT = "演示一";MB_NO_TEXT = "演示二";MB_CANCEL_TEXT = "演示三";var _msg = "<font color=red><b>演示:</b></font><br/>这是自定义的对话框<br/> <font color=green>MB_YES_TEXT MB_NO_TEXT MB_CANCEL_TEXT MB_OK_TEXT</font>";MessageBox(_msg,"演示",MB_ICON,MB_YESNOCANCEL,callback);}</script></head><body><a href="javascript:test()">普通演示</a><a href="javascript:test1()">回调演示一</a><a href="javascript:test2()">回调演示二</a><a href="javascript:test4()">回调演示三</a><a href="javascript:test3()"></a><a href="javascript:test3()">自定义演示</a></body></html> To geass非常感谢 贴出源码,但是此方式不能满足我的要求。原因是使用此模式 --》 在 标签页浏览模式下,无法使用全屏窗口只有使用ShowModualDialog 才能在标签页模式下不受影响使用全屏窗口.... 这是ie内部的机制,按住ie关闭按钮不放时,js停止执行!无法解决! 不只是JS停止执行,我测试过在页面放个AJAX的TIMER控件,后台代码一样不执行。 不知道解决方法 说实在的 你按下那个叉但是不放开鼠标他是不会执行关闭事件 也就无法判断除非自己写那个叉的onmousemove事件且这个事件中能捕捉到鼠标处于按下状态我想如果能做到这样 应该可以实现 只是微软好像没有公布IE的核心代码吧 再说就算公布了 不一定看的懂... 请问static作用 为什么执行结果为空啊高手来瞧瞧!!!!!!! 怎样获得前一个页面的URL地址?? MVC3 里面 如何劫持 Controllers的Action 100分啦 大家帮帮忙 从字符串中查找<img src="http://..." width="20">的正则表达式,不是UBB的[img],恳请!!! javascript语法? 请问百度 google 会不会收录.xml结尾的文件? 问一下sqlcommand和sqladapt类具体有什么用 关于检索目录的问题 *^_^*程序员体闲一刻 <我的征婚启示> 闲聊的朋友请进==》 关于asp.net多人开发的问题 ER图
捕捉鼠标的按下事件和释放事件。
至于说的离开那个X 可以获得X的坐标的(最大化)
请注意在普通窗口下不存在此问题,此问题只存在于模态或非模态窗口!) 这点有点麻烦哦
在模态窗口下 关闭窗口鼠标按下事件是无法捕获的。
另外计时器停止问题无法有效解决
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>MessageBox演示</title>
<script language="javascript">
/**//*******************************************************************************************
* 下面的内容可以拷贝到一个JS文件里面
*********************************************************************************************/
// 控制按钮常量
var MB_OK = 0;
var MB_CANCEL = 1;
var MB_OKCANCEL = 2;
var MB_YES = 3;
var MB_NO = 4;
var MB_YESNO = 5;
var MB_YESNOCANCEL = 6;
// 控制按钮文本
var MB_OK_TEXT = "确定";
var MB_CANCEL_TEXT = "取消";
var MB_YES_TEXT = " 是 ";
var MB_NO_TEXT = " 否 ";
//提示图标
var MB_ICON = "http://2lin.net/image/information.gif";
//委托方法
var MB_OK_METHOD = null;
var MB_CANCEL_METHOD = null;
var MB_YES_METHOD = null;
var MB_NO_METHOD = null;
var MB_BACKCALL = null;
var MB_STR = '<style type="text/css"><!--' +
'body{margin:0px;}' +
'.msgbox_title{background-color: #B1CDF3;height:25px;position:relative;font-size:14px;line-height:25px;padding-left:10px;border-bottom:1px solid #000;}' +
'.msgbox_control{text-align:center;clear:both;height:28px;}' +
'.msgbox_button{background-color: #B1CDF3;border:1px solid #003366;font-size:12px;line-height:20px;height:21px;}' +
'.msgbox_content{padding:10px;float:left;line-height: 20px;}' +
'.msgbox_icon{width: 50px;height: 50px;float: left;text-align: center;line-height:50px;padding-top:10px;}' +
'.msgbox_mask{position:absolute;left:0px;top:0px;z-index:99999;background-color:#333333;width:100%;height:100%;}' +
'.msgbox{background-color: #EFFAFE;position: absolute;height:auto;font-size:12px;top:50%;left:50%;border:1px solid #999999;}' +
'--></style>' +
'<div id="msgBoxMask" class="msgbox_mask" style="filter: alpha(opacity=0);display:none;"></div>' +
'<div class="msgbox" style="display:none; z-index:100000;" id="msgBox">' +
'<div class="msgbox_title" id="msgBoxTitle"></div>' +
'<div class="msgbox_icon" id="msgBoxIcon"></div>' +
'<div class="msgbox_content" id="msgBoxContent"></div>' +
'<div class="msgbox_control" id="msgBoxControl"></div></div>';
var Timer = null;
document.write(MB_STR);
var icon = new Image();
icon.src = MB_ICON;
/**//* 提示对话框
* 参数 1 : 提示内容
* 参数 2 : 提示标题
* 参数 3 : 图标路径
* 参数 4 : 按钮类型
*/
function MessageBox(){
var _content = arguments[0] || "这是一个对话框!";
var _title = arguments[1] || "提示";
var _icon = arguments[2] || MB_ICON;
var _button = arguments[3] || MB_OK;
MB_BACKCALL = arguments[4];var _iconStr = '<img src="{0}">';
var _btnStr = '<input name="{0}" id="{0}" type="button" class="msgbox_button" value="{1}" onclick="MBMethod(this)" />';
switch(_button)
{
case MB_CANCEL : _btnStr = _btnStr.toFormatString("msgBoxBtnCancel", MB_CANCEL_TEXT); break;
case MB_YES : _btnStr = _btnStr.toFormatString("msgBoxBtnYes", MB_YES_TEXT); break;case MB_NO : _btnStr = _btnStr.toFormatString("msgBoxBtnNo", MB_NO_TEXT); break;case MB_OKCANCEL :
_btnStr = _btnStr.toFormatString("msgBoxBtnOk", MB_OK_TEXT) + " " +
_btnStr.toFormatString("msgBoxBtnCancel", MB_CANCEL_TEXT);
break;case MB_YESNO :
_btnStr = _btnStr.toFormatString("msgBoxBtnYes", MB_YES_TEXT) + " " +
_btnStr.toFormatString("msgBoxBtnNo", MB_NO_TEXT);
break;case MB_YESNOCANCEL :
_btnStr = _btnStr.toFormatString("msgBoxBtnYes", MB_YES_TEXT) + " " +
_btnStr.toFormatString("msgBoxBtnNo", MB_NO_TEXT) + " " +
_btnStr.toFormatString("msgBoxBtnCancel", MB_CANCEL_TEXT);
break;default : _btnStr = _btnStr.toFormatString("msgBoxBtnOk", MB_OK_TEXT); break; }
//解决 FF 下会复位
ScrollTop = GetBrowserDocument().scrollTop;
ScrollLeft = GetBrowserDocument().scrollLeft;
GetBrowserDocument().style.overflow = "hidden";
GetBrowserDocument().scrollTop = ScrollTop;
GetBrowserDocument().scrollLeft = ScrollLeft; $("msgBoxTitle").innerHTML = _title;
$("msgBoxIcon").innerHTML = _iconStr.toFormatString(_icon);
$("msgBoxContent").innerHTML = _content;
$("msgBoxControl").innerHTML = _btnStr;OpacityValue = 0;
$("msgBox").style.display = "";
try{$("msgBoxMask").filters("alpha").opacity = 0;}catch(e){};
$("msgBoxMask").style.opacity = 0;
$("msgBoxMask").style.display = "";
$("msgBoxMask").style.height = GetBrowserDocument().scrollHeight + "px";
$("msgBoxMask").style.width = GetBrowserDocument().scrollWidth + "px";Timer = setInterval("DoAlpha()",1);
//设置位置
$("msgBox").style.width = "100%";
$("msgBox").style.width = ($("msgBoxIcon").offsetWidth + $("msgBoxContent").offsetWidth + 2) + "px";$("msgBox").style.marginTop = (-$("msgBox").offsetHeight/2 + GetBrowserDocument().scrollTop) + "px";
$("msgBox").style.marginLeft = (-$("msgBox").offsetWidth/2 + GetBrowserDocument().scrollLeft) + "px"; if(_button == MB_OK || _button == MB_OKCANCEL){
$("msgBoxBtnOk").focus();
}else if(_button == MB_YES || _button == MB_YESNO || _button == MB_YESNOCANCEL){
$("msgBoxBtnYes").focus();
}
}
var OpacityValue = 0;
var ScrollTop = 0;
var ScrollLeft = 0;
function GetBrowserDocument()
{
var _dcw = document.documentElement.clientHeight;
var _dow = document.documentElement.offsetHeight;
var _bcw = document.body.clientHeight;
var _bow = document.body.offsetHeight;if(_dcw == 0) return document.body;
if(_dcw == _dow) return document.documentElement;if(_bcw == _bow && _dcw != 0)
return document.documentElement;
else
return document.body;
}
function SetOpacity(obj,opacity){
if(opacity >=1 ) opacity = opacity / 100; try{obj.style.opacity = opacity; }catch(e){}try{
if(obj.filters){
obj.filters("alpha").opacity = opacity * 100;
}}catch(e){}
}
function DoAlpha(){
if (OpacityValue > 20){clearInterval(Timer);return 0;}
OpacityValue += 5;
SetOpacity($("msgBoxMask"),OpacityValue);
}
function MBMethod(obj)
{
switch(obj.id)
{
case "msgBoxBtnOk" : if(MB_BACKCALL) {MB_BACKCALL(MB_OK);} else {if(MB_OK_METHOD) MB_OK_METHOD();} break;
case "msgBoxBtnCancel" : if(MB_BACKCALL) {MB_BACKCALL(MB_CANCEL);} else {if(MB_CANCEL_METHOD) MB_CANCEL_METHOD();} break;
case "msgBoxBtnYes" : if(MB_BACKCALL) {MB_BACKCALL(MB_YES);} else {if(MB_YES_METHOD) MB_YES_METHOD();} break;
case "msgBoxBtnNo" : if(MB_BACKCALL) {MB_BACKCALL(MB_NO);} else {if(MB_NO_METHOD) MB_NO_METHOD();} break;
} MB_OK_METHOD = null;
MB_CANCEL_METHOD = null;
MB_YES_METHOD = null;
MB_NO_METHOD = null;
MB_BACKCALL = null;MB_OK_TEXT = "确定";
MB_CANCEL_TEXT = "取消";
MB_YES_TEXT = " 是 ";
MB_NO_TEXT = " 否 ";$("msgBox").style.display = "none";
$("msgBoxMask").style.display = "none";
GetBrowserDocument().style.overflow = "";
GetBrowserDocument().scrollTop = ScrollTop;
GetBrowserDocument().scrollLeft = ScrollLeft;
}
String.prototype.toFormatString = function(){
var _str = this;
for(var i = 0; i < arguments.length; i++){
_str = eval("_str.replace(/\\{"+ i +"\\}/ig,'" + arguments[i] + "')");
}
return _str;
}
function $(obj){
return document.getElementById(obj);
}
/**////////////////////////////////////////////////////////////////////////////////////////
</script>
<script language="javascript">
function test()
{
var _msg = "<font color=red><b>演示:</b></font><br/>普通对话框!";
MessageBox(_msg);
}
function test1()
{
MB_OK_METHOD = function(){alert('你按了OK');}
MB_YES_METHOD = function(){alert('你按了YES');}
MB_NO_METHOD = function(){alert('你按了NO');}
MB_CANCEL_METHOD = function(){alert('你按了CANCEL');}
var _msg = "<font color=red><b>演示:</b></font><br/>调用对话框。是、否、取消";
MessageBox(_msg,"演示",null,MB_YESNOCANCEL);
}
function test2()
{
var _msg = "<font color=red><b>演示:</b></font><br/>调用对话框。是、否、取消";
MessageBox(_msg,"演示",MB_ICON,MB_YESNOCANCEL,callback);
}
function test4()
{
var _msg = "<font color=red><b>演示:</b></font><br/>调用对话框。确定、取消";
MessageBox(_msg,"演示",MB_ICON,MB_OKCANCEL,callback);
}
function callback(value)
{
switch(value)
{
case MB_OK : alert('你按了OK'); break;
case MB_YES : alert('你按了YES'); break;
case MB_NO : alert('你按了NO'); break;
case MB_CANCEL : alert('你按了CANCEL'); break;
}
}
function test3()
{
MB_YES_TEXT = "演示一";
MB_NO_TEXT = "演示二";
MB_CANCEL_TEXT = "演示三";
var _msg = "<font color=red><b>演示:</b></font><br/>这是自定义的对话框<br/> <font color=green>MB_YES_TEXT MB_NO_TEXT MB_CANCEL_TEXT MB_OK_TEXT</font>";
MessageBox(_msg,"演示",MB_ICON,MB_YESNOCANCEL,callback);
}
</script>
</head>
<body>
<a href="javascript:test()">普通演示</a>
<a href="javascript:test1()">回调演示一</a>
<a href="javascript:test2()">回调演示二</a><a href="javascript:test4()">回调演示三</a><a href="javascript:test3()"></a><a href="javascript:test3()">自定义演示</a>
</body>
</html>
无法解决!
说实在的 你按下那个叉但是不放开鼠标他是不会执行关闭事件 也就无法判断
除非自己写那个叉的onmousemove事件且这个事件中能捕捉到鼠标处于按下状态
我想如果能做到这样 应该可以实现 只是微软好像没有公布IE的核心代码吧 再说就算公布了 不一定看的懂...