?? index.jsp
字號:
<%@ page contentType="text/html; charset=GBK"%>
<html>
<head>
<title>計算機類圖書銷售統計圖</title>
<script type='text/javascript' src='/webchart/dwr/interface/DataExchange.js'></script>
<script type='text/javascript' src='/webchart/dwr/engine.js'></script>
<script type='text/javascript' src='/webchart/dwr/util.js'></script>
<script type="text/javascript">
var updateClicked=0;
//獲得數據
function getData(month) {
DWRUtil.useLoadingMessage("正在加載數據...");
DataExchange.getData(month,getDataCallback);
}
function getDataCallback(data) {
var month=data[0];
//初始化每本書的銷售量
document.getElementById("javaText").value=data[1];
document.getElementById("netText").value=data[2];
document.getElementById("cText").value=data[3];
document.getElementById("pbText").value=data[4];
document.getElementById("pascalText").value=data[5];
//初始化圖片
var checkedRadio;
if (document.getElementsByName("radio")[0].checked) {
checkedRadio="line"
} else if (document.getElementsByName("radio")[1].checked) {
checkedRadio="rect"
} else if (document.getElementsByName("radio")[2].checked) {
checkedRadio="pie"
}
document.getElementById("image").src="image.jsp?month="+month+"&image="+checkedRadio+"&update="+updateClicked;
}
//控制顯示圖片
function radioclicked() {
var month=document.getElementById("monthOption").value;
if (event.srcElement.value=="line") {
document.getElementById("image").src="image.jsp?month="+month+"&image=line&update="+updateClicked;
} else if (event.srcElement.value=="rect") {
document.getElementById("image").src="image.jsp?month="+month+"&image=rect&update="+updateClicked;
} else if (event.srcElement.value=="pie") {
document.getElementById("image").src="image.jsp?month="+month+"&image=pie&update="+updateClicked;
}
}
//月份改變
function monthChanged() {
var month = document.getElementById("monthOption").value;
getData(month);
}
//修改數據
function updateData() {
var month;
var data = new Array(5);
month=document.getElementById("monthOption").value;
data[0]=document.getElementById("javaText").value;
data[1]=document.getElementById("netText").value;
data[2]=document.getElementById("cText").value;
data[3]=document.getElementById("pbText").value;
data[4]=document.getElementById("pascalText").value;
updateClicked = Math.round(Math.random()*100);
DataExchange.updateData(data,month,updateCallback);
}
function updateCallback(data) {
if (data) {
alert("修改成功");
var month=document.getElementById("monthOption").value;
if (document.getElementsByName("radio")[0].checked) {
checkedRadio="line"
} else if (document.getElementsByName("radio")[1].checked) {
checkedRadio="rect"
} else if (document.getElementsByName("radio")[2].checked) {
checkedRadio="pie"
}
document.getElementById("image").src="image.jsp?month="+month+"&image="+checkedRadio+"&update="+updateClicked;
} else {
alert("修改失敗");
}
}
</script>
</head>
<body onload="getData(1)">
<div align="center">
<h1><font color="red">2007年上半年計算機類圖書銷售情況</font></h1>
<table width="800" border="1">
<tr valign="TOP" align="CENTER"><td width="250">
<form method="get" name="monthform" >
<select id="monthOption" onchange="monthChanged()">
<option value="1">一月份</option>
<option value="2">二月份</option>
<option value="3">三月份</option>
<option value="4">四月份</option>
<option value="5">五月份</option>
<option value="6">六月份</option>
</select>
</form>
<table width="250" border="0" height="173">
<tr><td>JAVA</td><td valign="top"><br></td><td><input type="text" id="javaText" ></td></tr>
<tr><td>.NET</td><td valign="top"><br></td><td><input type="text" id="netText" ></td></tr>
<tr><td>C</td><td valign="top"><br></td><td><input type="text" id="cText" ></td></tr>
<tr><td>PB</td><td valign="top"><br></td><td><input type="text" id="pbText"></td></tr>
<tr><td>PASCAL</td><td valign="top"><br></td><td><input type="text" id="pascalText" ></td></tr>
<tr><td align="right" colspan="3"><input type="submit" value="修改" name="button" onclick="updateData()"></td></tr>
</table>
</td>
<td><table border="0" width="550" height="114">
<tr><td height="20" align="center">
<form method="get" name="radioform">
<input type="radio" value="line" name="radio" onclick="radioclicked()" checked>曲線圖
<input type="radio" value="rect" name="radio" onclick="radioclicked()">直方圖
<input type="radio" value="pie" name="radio" onclick="radioclicked()">餅圖<br>
</form></td>
</tr>
<tr><td align="center"><img id="image"/></td></tr>
</table>
</td>
</tr>
</table>
</div>
</body>
</html>
?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -