- 浏览: 25187 次
- 性别:
- 来自: 成都
最新评论
http://e2talentbrian.blog.163.com/blog/static/105486710200953071748235/ /**************************************************js******************************************************************************/ var oldTop = 0, oldLeft = 0; var oldEventX = 0, oldEventY = 0; var ShadeArea; var WinArea; var canmove = false; var url = this.location.host; var hover = '#000000', normal = '#000000'; function BeginDrag(obj) { if (event.button == 1) { WinArea = obj.parentNode; ShadeArea = WinArea.nextSibling; obj.setCapture(); oldEventX = event.clientX; oldEventY = event.clientY; oldLeft = parseInt(WinArea.style.left); oldTop = parseInt(WinArea.style.top); ShadeArea.style.width = WinArea.offsetWidth; ShadeArea.style.height = WinArea.offsetHeight; ShadeArea.style.display = ""; ShadeArea.style.left = oldLeft + 5; ShadeArea.style.top = oldTop + 5; ShadeArea.style.backgroundColor = normal; ShadeArea.style.filter = "alpha(opacity=40)"; canmove = true; } } function EndDrag(obj) { if (canmove) { ShadeArea.style.display = "none"; ShadeArea.style.left = oldLeft; ShadeArea.style.top = oldTop; obj.releaseCapture(); canmove = false; } } function Draging(obj) { if (canmove) { WinArea.style.left = oldLeft + event.clientX - oldEventX; WinArea.style.top = oldTop + event.clientY - oldEventY; ShadeArea.style.left = parseInt(WinArea.style.left) + 5; ShadeArea.style.top = parseInt(WinArea.style.top) + 5; } } var isAlertDivBuilded = false; function BuildAlertDiv() { var strAlert = ""; strAlert += "<div id='AlertDiv' style='position:absolute;display:none;z-index:1002; display:none;'>"; strAlert += " <div class='message_width' onmousedown='BeginDrag(this)' onmouseup='EndDrag(this)' onmousemove='Draging(this)'>"; strAlert += " <table class='message_title'>"; strAlert += " <tr>"; strAlert += " <td><div class='message_div'>" + _alertTitle + "</div>"; strAlert += " <div class='message_close'><a href='#'><img id='closeButton' style='cursor:pointer;' src='http://" + url + "/Images/_system_image/cancel.png' alt='Close' title='Close' width='16px' height='16px' /></a></div></td>"; strAlert += " </tr>"; strAlert += " </table>"; strAlert += " </div>"; strAlert += " <div class='message_width'>"; strAlert += " <table class='message_contain' cellpadding='0' cellspacing='0'>"; strAlert += " <tr>"; strAlert += " <td colspan='2' height='25'> </td>"; strAlert += " </tr>"; strAlert += " <tr>"; strAlert += " <td class='message_leftcontain'><img src='http://" + url + "/Images/_system_image/icon-info.gif' alt='Information' title='Information' width='40' height='40' /></td>"; strAlert += " <td class='message_rightcontain'><div id='alertMessageDiv'>"; strAlert += " </div>"; strAlert += " </tr>"; strAlert += " <tr>"; strAlert += " <td colspan='2' height='20'> </td>"; strAlert += " </tr>"; strAlert += " <tr>"; strAlert += " <td colspan='2' class='message_button' height='25px'><input id='alertButton' class='Form-InputButton' type='button' name='btnOk' value='" + _alertbuttonText + "'/></td>"; strAlert += " </tr>"; strAlert += " </table>"; strAlert += " </div>"; strAlert += "</div>"; strAlert += "<div style='position:absolute; z-index:1001; display:none;'></div>"; document.body.insertAdjacentHTML("afterBegin", strAlert); isAlertDivBuilded = true; } (function() { SelectsFactory = { get_Instance: function() { if (Selects.instance == null) { return new Selects(); } else { return Selects.instance; } } } var Selects = function() { this.BuildInput = function(select) { var textbox = document.createElement("INPUT"); if (select.options != null && select.selectedIndex >= 0) { textbox.value = select.options[select.selectedIndex].text; } textbox.style.width = select.offsetWidth; textbox.display = 'none'; var className = select.className; if (className != null) { className = className.toLowerCase(); if (className == 'select_norrow') { textbox.className = 'input_narrow'; } else { textbox.className = 'input'; } } else { textbox.className = 'input'; } select.insertAdjacentElement("beforeBegin", textbox); } this.HiddenSelect = function() { var arrSelect = document.getElementsByTagName("SELECT"); for (var i = 0; i < arrSelect.length; i++) { var select = arrSelect[i]; if (select.previousSibling == null) { this.BuildInput(select); } select.style.display = "none"; try { select.previousSibling.style.display = ""; } catch (ex) { } } } this.ShowSelect = function() { var arrSelect = document.getElementsByTagName("SELECT"); for (var i = 0; i < arrSelect.length; i++) { var select = arrSelect[i]; if (select.previousSibling == null) { this.BuildInput(select); } select.style.display = ""; try { select.previousSibling.style.display = "none"; } catch (ex) { } } } Selects.instance = this; } })(); (function() { ShadeFactory = { get_Instance: function(backgroundColor, alpha, zindex) { if (Shade.instance == null) { return new Shade(backgroundColor, alpha, zindex); } else { if (backgroundColor != null) { Shade.instance.ShadeDiv.style.backgroundColor = backgroundColor; } else { Shade.instance.ShadeDiv.style.backgroundColor = "#FFFFFF"; } if (alpha != null) { Shade.instance.ShadeDiv.style.filter = "alpha(opacity=" + alpha + ")"; } else { Shade.instance.ShadeDiv.style.filter = "alpha(opacity=20)"; } if (zindex != null) { Shade.instance.ShadeDiv.style.zIndex = zindex; } else { Shade.instance.ShadeDiv.style.zIndex = 1; } return Shade.instance; } } } var Shade = function(backgroundColor, alpha, zindex) { Shade.instance = this; this.referenceCount = 0; this.ShadeDiv = document.createElement("DIV"); if (backgroundColor != null) { this.ShadeDiv.style.backgroundColor = backgroundColor; } else { this.ShadeDiv.style.backgroundColor = "#FFFFFF"; } if (alpha != null) { this.ShadeDiv.style.filter = "alpha(opacity=" + alpha + ")"; } else { this.ShadeDiv.style.filter = "alpha(opacity=20)"; } if (zindex != null) { this.ShadeDiv.style.zIndex = zindex; } else { this.ShadeDiv.style.zIndex = 1; } this.ShadeDiv.style.display = "none"; this.ShadeDiv.style.position = "absolute"; document.body.insertAdjacentElement("afterBegin", this.ShadeDiv); this.selectsObj = SelectsFactory.get_Instance(); this.Show = function() { this.referenceCount = this.referenceCount + 1; this.ShadeDiv.style.display = ""; this.ShadeDiv.style.left = this.ShadeDiv.style.top = 0; this.ShadeDiv.style.width = document.documentElement.offsetWidth; this.ShadeDiv.style.height = document.documentElement.offsetHeight; if (isIE && version < 7) { this.selectsObj.HiddenSelect(); } } this.Hidden = function() { this.referenceCount = this.referenceCount - 1; if (this.referenceCount <= 0) { this.ShadeDiv.style.display = "none"; this.ShadeDiv.style.left = this.ShadeDiv.style.top = 0; this.ShadeDiv.style.width = 0; this.ShadeDiv.style.height = 0; this.ShadeDiv.style.backgroundColor = ""; this.ShadeDiv.style.filter = ""; if (isIE && version < 7) { this.selectsObj.ShowSelect(); } } } } })(); var isIE = navigator.appName.indexOf("Internet Explorer") != -1; var strVersion = navigator.appVersion.toString(); var version = parseInt(strVersion.substring(strVersion.indexOf("MSIE") + 4, strVersion.indexOf("MSIE") +); var arrMessages = []; var arrCallBacks = []; var oldFocus = null; var oldAlert = window.alert; window.alert = function(message, callBack) { if (!isIE) { oldAlert(message); eval(callBack); return; } if (isAlertDivBuilded == false) { BuildAlertDiv(); } var shadeObj = ShadeFactory.get_Instance("#FFFFFF", 0, 1000); if (arrMessages.length <= 0) { shadeObj.Show(); } var alertButton = document.getElementById("alertButton"); var closeButton = document.getElementById("closeButton"); function ShowAlertDiv(message) { var alertMessageDiv = document.getElementById("alertMessageDiv"); alertMessageDiv.innerHTML = message; var alertDiv = document.getElementById("AlertDiv"); alertDiv.style.display = ""; alertDiv.style.top = document.documentElement.scrollTop + (document.documentElement.clientHeight - parseInt(alertDiv.offsetHeight)) / 2 + "px"; alertDiv.style.left = document.documentElement.scrollLeft + (document.documentElement.clientWidth - parseInt(alertDiv.offsetWidth)) / 2 + "px"; alertButton.focus(); } if (arrMessages.length <= 0) { oldFocus = document.activeElement; ShowAlertDiv(message); } arrMessages.push(message); arrCallBacks.push(callBack); function HiddenAlertDiv() { arrMessages.shift(); if (arrCallBacks.length > 0 && arrCallBacks[0] != null) { eval(arrCallBacks[0]); arrCallBacks.shift(); } if (arrMessages.length > 0) { ShowAlertDiv(arrMessages[0]); return; } else { if (oldFocus != null && oldFocus.disabled == false) { oldFocus.focus(); } } shadeObj.Hidden(); document.getElementById("AlertDiv").style.display = "none"; } if (document.addEventListener) { closeButton.addEventListener("click", HiddenAlertDiv, false); alertButton.addEventListener("click", HiddenAlertDiv, false); } else { closeButton.onclick = alertButton.onclick = HiddenAlertDiv; } } var oldTop=0,oldLeft=0; var oldEventX = 0,oldEventY = 0; var ShadeArea; var WinArea; var canmove=false; var hover='#000000',normal='#000000'; function BeginDrag(obj){ if(event.button==1) { WinArea = obj.parentNode; ShadeArea = WinArea.nextSibling; obj.setCapture(); oldEventX = event.clientX; oldEventY = event.clientY; oldLeft = parseInt(WinArea.style.left); oldTop = parseInt(WinArea.style.top); ShadeArea.style.width = WinArea.offsetWidth; ShadeArea.style.height = WinArea.offsetHeight; ShadeArea.style.display = ""; ShadeArea.style.left = oldLeft +5; ShadeArea.style.top = oldTop + 5; ShadeArea.style.backgroundColor = normal; ShadeArea.style.filter = "alpha(opacity=40)"; canmove = true; } } function EndDrag(obj){ if(canmove) { ShadeArea.style.display = "none"; ShadeArea.style.left = oldLeft; ShadeArea.style.top = oldTop; obj.releaseCapture(); canmove = false; } } function Draging(obj){ if(canmove){ WinArea.style.left = oldLeft + event.clientX - oldEventX; WinArea.style.top = oldTop + event.clientY - oldEventY; ShadeArea.style.left = parseInt(WinArea.style.left) + 5; ShadeArea.style.top = parseInt(WinArea.style.top) + 5; } } (function(){ SelectsFactory = { get_Instance:function(){ if(Selects.instance == null){ return new Selects(); } else{ return Selects.instance; } } } var Selects = function(){ this.BuildInput = function(select){ var textbox = document.createElement("INPUT"); if(select.options != null && select.selectedIndex >=0 ){ textbox.value = select.options[select.selectedIndex].text; } textbox.style.width = select.offsetWidth; textbox.display = 'none'; var className = select.className; if(className!=null){ className = className.toLowerCase(); if(className == 'select_norrow'){ textbox.className = 'input_narrow'; } else{ textbox.className = 'input'; } } else{ textbox.className = 'input'; } select.insertAdjacentElement("beforeBegin",textbox); } this.HiddenSelect =function(){ var arrSelect = document.getElementsByTagName("SELECT"); for(var i=0;i<arrSelect.length;i++){ var select = arrSelect[i]; if(select.previousSibling == null){ this.BuildInput(select); } select.style.display = "none"; try { select.previousSibling.style.display = ""; }catch(ex){} } } this.ShowSelect = function(){ var arrSelect = document.getElementsByTagName("SELECT"); for(var i=0;i<arrSelect.length;i++){ var select = arrSelect[i]; if(select.previousSibling == null){ this.BuildInput(select); } select.style.display = ""; try { select.previousSibling.style.display = "none"; }catch(ex){} } } Selects.instance = this; } })(); (function(){ ShadeFactory = { get_Instance:function(backgroundColor,alpha,zindex){ if(Shade.instance == null){ return new Shade(backgroundColor,alpha,zindex); } else{ if(backgroundColor != null){ Shade.instance.ShadeDiv.style.backgroundColor = backgroundColor; } else{ Shade.instance.ShadeDiv.style.backgroundColor = "#FFFFFF"; } if(alpha != null){ Shade.instance.ShadeDiv.style.filter = "alpha(opacity="+alpha+")"; } else{ Shade.instance.ShadeDiv.style.filter = "alpha(opacity=20)"; } if(zindex != null){ Shade.instance.ShadeDiv.style.zIndex = zindex; } else{ Shade.instance.ShadeDiv.style.zIndex = 1; } return Shade.instance; } } } var Shade = function(backgroundColor,alpha,zindex){ Shade.instance = this; this.referenceCount = 0; this.ShadeDiv = document.createElement("DIV"); if(backgroundColor != null){ this.ShadeDiv.style.backgroundColor = backgroundColor; } else{ this.ShadeDiv.style.backgroundColor = "#FFFFFF"; } if(alpha != null){ this.ShadeDiv.style.filter = "alpha(opacity="+alpha+")"; } else{ this.ShadeDiv.style.filter = "alpha(opacity=20)"; } if(zindex != null){ this.ShadeDiv.style.zIndex = zindex; } else{ this.ShadeDiv.style.zIndex = 1; } this.ShadeDiv.style.display = "none"; this.ShadeDiv.style.position = "absolute"; document.body.insertAdjacentElement("afterBegin",this.ShadeDiv); this.selectsObj = SelectsFactory.get_Instance(); this.Show = function(){ this.referenceCount = this.referenceCount + 1 ; this.ShadeDiv.style.display=""; this.ShadeDiv.style.left = this.ShadeDiv.style.top = 0; this.ShadeDiv.style.width = document.documentElement.offsetWidth; this.ShadeDiv.style.height = document.documentElement.offsetHeight; if(isIE && version<7){ this.selectsObj.HiddenSelect(); } } this.Hidden = function(){ this.referenceCount = this.referenceCount - 1 ; if(this.referenceCount <= 0){ this.ShadeDiv.style.display="none"; this.ShadeDiv.style.left = this.ShadeDiv.style.top = 0; this.ShadeDiv.style.width = 0; this.ShadeDiv.style.height = 0 ; this.ShadeDiv.style.backgroundColor = ""; this.ShadeDiv.style.filter = ""; if(isIE && version<7){ this.selectsObj.ShowSelect(); } } } } })(); var isConfirmDivBuilded = false; function BuildConfirmDiv(){ var strConfirm = ""; strConfirm += "<div id='ConfirmDiv' style='position:absolute;display:none;z-index:1002; display:none;'>"; strConfirm +=" <div class='message_width' onmousedown='BeginDrag(this)' onmouseup='EndDrag(this)' onmousemove='Draging(this)'>"; strConfirm +=" <table class='message_title'>"; strConfirm +=" <tr>"; strConfirm += " <td><div class='message_div'>" + _confirmTitle + "</div>"; strConfirm += " <div class='message_close'><a href='#'><img id='confirmCloseButton' style='cursor:pointer;' src='http://" + url + "/Images/_system_image/cancel.png' alt='Close' title='Close' width='40' height='40' /></a></div></td>"; strConfirm +=" </tr>"; strConfirm +=" </table>"; strConfirm +=" </div>"; strConfirm +=" <div class='message_width'>"; strConfirm +=" <table class='message_contain' cellpadding='0' cellspacing='0'>"; strConfirm +=" <tr>"; strConfirm +=" <td colspan='2' height='25'> </td>"; strConfirm +=" </tr>"; strConfirm +=" <tr>"; strConfirm += " <td class='message_leftcontain'><img src='http://" + url + "/Images/_system_image/icon-question.gif' alt='Query' title='Query' width='40' height='40' /></td>"; strConfirm +=" <td class='message_rightcontain'><div id='confirmMessageDiv'>"; strConfirm +=" </div>"; strConfirm +=" </tr>"; strConfirm +=" <tr>"; strConfirm +=" <td colspan='2' height='35'> </td>"; strConfirm +=" </tr>"; strConfirm +=" <tr>"; strConfirm += " <td colspan='2' class='message_button'><input id='confirmOKButton' style='margin-right:20px;' class='Form-InputButton' type='button' name='btnOk' value='" + _confirmButtonText + "'/><input id='confirmCancelButton' class='Form-InputButton' type='button' name='btnOk' value='" + _CancelButtonText + "'/></td>"; strConfirm +=" </tr>"; strConfirm +=" </table>"; strConfirm +=" </div>"; strConfirm +="</div>"; strConfirm +="<div style='position:absolute; z-index:1001; display:none;'></div>"; document.body.insertAdjacentHTML("afterBegin",strConfirm); isConfirmDivBuilded = true; } var isIE = navigator.appName.indexOf("Internet Explorer")!= -1; var strVersion = navigator.appVersion.toString(); var version =parseInt(strVersion.substring(strVersion.indexOf("MSIE")+4,strVersion.indexOf("MSIE")+8)); window.confirm = function(message, okCallBack, cancelCallBack) { if (isConfirmDivBuilded == false) { BuildConfirmDiv(); } var shadeObj = ShadeFactory.get_Instance("#FFFFFF", 0, 1000); shadeObj.Show(); var confirmDiv = document.getElementById("ConfirmDiv"); confirmDiv.style.display = ""; confirmDiv.style.top = document.documentElement.scrollTop + (document.documentElement.clientHeight - parseInt(confirmDiv.offsetHeight)) / 2 + "px"; confirmDiv.style.left = document.documentElement.scrollLeft + (document.documentElement.clientWidth - parseInt(confirmDiv.offsetWidth)) / 2 + "px"; var confirmMessageDiv = document.getElementById("confirmMessageDiv"); confirmMessageDiv.innerHTML = message; var confirmOKButton = document.getElementById("confirmOKButton"); confirmOKButton.focus(); var confirmCancelButton = document.getElementById("confirmCancelButton"); var confirmCloseButton = document.getElementById("confirmCloseButton"); confirmCloseButton.onclick = confirmCancelButton.onclick = function() { shadeObj.Hidden(); document.getElementById("ConfirmDiv").style.display = "none"; if (cancelCallBack != null && cancelCallBack != "") { eval(cancelCallBack); } } confirmOKButton.onclick = function() { shadeObj.Hidden(); document.getElementById("ConfirmDiv").style.display = "none"; if (okCallBack != null && okCallBack != "") { eval(okCallBack); } document.forms(0).submit(); return true; } return false; } /************************************************************js********************************************************************/ /************************************************************css********************************************************************/ .message_width{ width: 420px; color: #31415A; } .message_title { width: 420px; background-image:url('images/mso-hd.gif'); background-repeat:repeat-x; background-color: #DEEAF4; border-top: solid 1px #8F8F8F; border-left: solid 1px #8F8F8F; border-right: solid 1px #8F8F8F; border-bottom: 0px; } .message_div { float: left; font-weight: bold; padding-top: 6px; padding-left: 10px; } .message_close { float: right; padding: 9px; height: 8px; width: 8px; } .message_close img { border: 0px; width: 16px; height: 16px; } .message_close a { height:16px; width:16px; } .message_close a:hover { } .message_contain { width: 420px; border-top: 0px; border-left: solid 1px #8F8F8F; border-right: solid 1px #8F8F8F; border-bottom: solid 1px #8F8F8F; background-color: #FFFFFF; height:40px } .message_leftcontain { width: 100px; text-align: right; vertical-align: top; } .message_rightcontain { word-break:break-all; padding: 0px 45px; } .message_button { text-align: center; width: 420px; background-color: #E1EFFF; border-bottom: 0px; } .list { margin: 0px 20px 0px 5px; padding: 0px 3px 0px 3px; line-height: 20px; border: 1px solid #AABACA; font-size: 12px; }
相关推荐
`alert`通常用来展示一个简单的警告消息,而`confirm`则会弹出一个带有“确定”和“取消”按钮的对话框,等待用户做出选择。在网页开发中,有时我们需要自定义这些函数的行为,比如改变它们的样式、添加额外功能或者...
在JavaScript的世界里,`alert`和`confirm`是两个非常基础且常用的内置函数,它们分别用于弹出警告对话框和确认对话框。然而,这些原生功能有时可能无法满足开发者对于用户界面和交互的定制需求。这篇博客"重写微软...
调用`alert('message')`会在浏览器中弹出一个对话框,显示指定的消息,并有一个确定按钮关闭窗口。这个功能在调试和简单的用户通知中非常常见。 `confirm`函数则提供了一个带有“确定”和“取消”两个按钮的对话框...
除了使用`alert`,还可以考虑其他类型的对话框,如`prompt`(获取用户输入)或`confirm`(提供是/否选择),甚至可以使用自定义的模态对话框,这些通常能提供更好的用户体验,因为它们可以更灵活地设计样式和交互。...
在JavaScript编程中,"js实现弹出框"是一个常见的需求,主要是为了替代或自定义浏览器内置的`window.alert()`, `window.confirm()`和`window.prompt()`功能。这些原生的弹出框虽然简单易用,但样式固定且交互性有限...
1. JavaScript:利用JavaScript的`window.alert()`, `window.confirm()`和`window.prompt()`函数可以创建基本的弹出对话框。例如,`alert("这是一个警告!")`会显示一个带有消息的警告对话框,而`confirm("你确定要...
`alert()`、`confirm()`和`prompt()`是JavaScript内置的弹出对话框,它们分别用于显示信息、获取用户确认和输入数据。然而,这些基本功能往往无法满足开发者对自定义界面和高级交互的需求。因此,重写和扩展这些函数...
JavaScript中的弹窗是Web开发中非常基础且常用的功能,用于在浏览器中弹出信息窗口,让用户的操作流程更加直观和顺畅。在给定文件中,详细介绍了JavaScript中的三种弹窗类型,并通过示例代码展示了如何通过...
弹出提示信息 `window.alert("字符");` 弹出一个包含指定消息的警告框。 ```javascript window.alert("This is an alert box!"); ``` #### 22. 确认对话框 `window.confirm();` 显示一个确认对话框,用户可以...
弹出提示框** - `window.alert("文本");` - 显示一个包含指定文本的警告对话框。 **18. 确认对话框** - `window.confirm()` - 显示一个带有确认按钮和取消按钮的对话框,并返回一个布尔值指示用户的选择。 **19...