[原创]使用自定义的alert和confirm

最新推荐文章于 2023-12-01 10:46:55 发布

kaibinsj

最新推荐文章于 2023-12-01 10:46:55 发布

阅读量4.5k

点赞数

分类专栏：技术专栏文章标签： javascript stylesheet function table html border

本文链接：https://blog.csdn.net/kaibinsj/article/details/183750

版权

技术专栏专栏收录该内容

32 篇文章 0 订阅

订阅专栏

原理，定义自己定义的alert页面(Message.jsp)和confirm页面(confirm.jsp)，
之后通过showModalDialog，在javascript中显示和alert()和confirm()相同的效果。

Message.jsp

<%@ page contentType="text/html; charset=GB2312" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//CN">
<HTML>
<HEAD>
  <title>Message</title>
  <meta content="JavaScript" name="vs_defaultClientScript">
  <LINK href="../ScmStyle.css" type="text/css" rel="stylesheet">
  <script language="javascript">
   document.title = window.dialogArguments[0];
   function OnLoading(){
    var Args = window.dialogArguments;
    document.all("divMessage").innerText = Args[1];
    if(Args[2]=="err"){
     document.all("Img1").src="../images/bq_r1_c1.gif";
     document.all("divMessage").style.color = "#ff0000";
    }else if(Args[2]=="info"){
     document.all("Img1").src="../images/zy_r1_c1.gif";
     document.all("divMessage").style.color = "#000000";
    }else{
     document.all("Img1").src="../images/cg_r1_c1.gif";
     document.all("divMessage").style.color = "#000000";
    }
   }
  </script>
</HEAD>
<body οnlοad="OnLoading();" leftmargin="0" topmargin="0">
  <table width="420" cellspacing="0" cellpadding="0" height="165" background="../images/gr.gif">
    <tr align="center">
   <td width="143" height="37"> </td>
   <td width="277" height="37"> </td>
    </tr>
    <tr align="center">
   <td width="143" height="72" valign="bottom"><img id="Img1" src="" width="81" height="81"></td>
   <td width="277" height="72">
    <div id="divMessage" style="WIDTH: 250px" align="center">
    </div>
   </td>
    </tr>
    <tr align="center">
   <td width="143"> </td>
   <td width="272">
    <img src="../images/close1.gif" width="112" height="25" onClick="window.close();" style='cursor:hand;'>
   </td>
    </tr>
  </table>
</body>
</HTML>

confirm.jsp

<html>
<head>
<script language="javascript">

</script>
<script language="javascript">
function init()
{
var args = window.dialogArguments;

try{
message.innerHTML = args[1]; //设置提示的信息
if(args[2] == 1)    //设置按钮的选中状态
   ok.focus();
else
   cancel.focus();

}catch(e)
{
//这里屏蔽了错误，防止万一调用的传递参数不足
}
ok.attachEvent("onclick",okClick); //设置YES按钮的事件处理函数
cancel.attachEvent("onclick",cancelClick);//设置NO按钮的事件处理函数
}
function okClick()//YES按钮的事件处理函数
{
window.returnValue = true;
window.close();
}
function cancelClick()//NO按钮的事件处理函数
{
window.returnValue = false
window.close();
}
window.attachEvent("onload",init)

</script>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<link rel="stylesheet" href="../ScmStyle.css" type="text/css">
</head>

调用alert，使用自定义的showMessage()
function showMessage(title,info,type){
var Args = new Array(title,info,type);
var locationURL = DynamicHtmlGetApplicationUrlRoot()+"common/Message.jsp";
window.showModalDialog(locationURL,Args,"dialogWidth=420px;dialogHeight=190px;resizable:no;scroll:no;status:no");
}

调用confirm，使用自定义的showConfirm()
function showConfirm(strTitle,strMessage)
{
var locationURL = "/common/confirm.jsp";
var args = new Array();
args[args.length] = strTitle;
args[args.length] = strMessage;
args[args.length] = 1;
var result = showModalDialog(locationURL,args,"dialogWidth=425px;dialogHeight=190px;resizable:no;scroll:no;status:no");
return result;
}

参加jsp中实例
showMessage("信息提示","密码不能为空！","info");
if (showConfirm("工作流模块","提交任务号为：" + workflowid + " 的任务吗？")){}

kaibinsj

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
[原创]使用自定义的alert和confirm

原理，定义自己定义的alert页面(Message.jsp)和confirm页面(confirm.jsp)，之后通过showModalDialog，在javascript中显示和alert()和confirm()相同的效果。Message.jsp Message document.title = window.dialogArguments[0]; function
复制链接

扫一扫