JavaScript源码
功能:根据跳转链接monitor/alertdata.do链接,获取后台数据并将数据结果保存在dat变量中
根据dat变量中的alarm的值,确定需要加载的图片的链接
$(document).ready(function(){
alertImg("monitor/alertdata.do", "table");
});
function alertImg(action,div) {
$.post(action, function(dat){
switch(dat.alarm)
{
case "1":
document.getElementById("alertImg").innerHTML ='<img name="alertImg" src="./css/images/alert.gif" alt="alert" width="40" height="40" align="right">';
break;
default:
document.getElementById("alertImg").innerHTML ='<img name="alertImg" src="./css/images/normal.jpg" alt="alert" width="40" height="40" align="right">';
}
})
}
JSP源码
主要注意div的id的名称和是否加载了javascript即可
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" import="java.util.*"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<style type="text/css">
<!--
.headbig {
font-size: 30px;
font-family: "Comic Sans MS", cursive;
}
.welcomeWords {
text-align: right;
font-size: 14px;
font-weight: bold;
}
.backToIndex {
font-weight: bold;
}
#apDiv1 {
position:absolute;
width:65px;
height:59px;
z-index:1;
top: 74px;
left: 754px;
}
table {
margin:0 auto;
}
-->
</style>
<script src="js/alert.js" type="text/javascript"></script>
<table width="100%" height="109" border="0" background="./css/images/index_top_bg.png" class="welcomeWords">
<tr>
<td height="105"><table width="98%" height="102" border="0" align="center">
<tr>
<td width="170" height="82" rowspan="3"><img src="./css/images/DICE_logo_pic.png" width="99" height="96" alt="Dice_logo" align="left"></td>
<td rowspan="3"><span class="headbig"> <p style="color:#FFF; font-weight: bold; text-align:left; font-size: 36px;">DICE 网络管理系统</p>
</span></td>
<td width="17%" height="56" id="alertImg"><span style="color:#FFF; font-weight: bold;"></span></td>
</tr>
<tr>
<td height="18" class="welcomeWords"><p class="welcomeWords" style="color:#FFF; font-size: 14px;"> 欢迎使用DICE OAM,<span style="color: #EEFE29; font-size: 16px;">${session.ADMIN_USERNAME_KEY}</span></p></td>
</tr>
<tr>
<td height="18" align="right"><a href="/oam/index/main.html" title="退回登录页面" target="_top" class="backToIndex"><p style="color:#FFF; font-size: 14px;">退出</p></a></td>
</tr>
</table></td>
</tr>
</table>