<html>
<head>
<meta charset="utf-8">
</head>
<body>
<h1>运动会成绩系统</h1>
<div id="显示"></div>
<hr>
<table id="数据表" border="1"></table>
</body>
<script>
var 数据库=openDatabase('MyData','1.0版','我的数据库描述',102400);
数据库.transaction(function(数据库事务){
数据库事务.executeSql('CREATE TABLE IF NOT EXISTS 成绩(项目,学院,名次)',[]);
});
var 数据表=document.getElementById("数据表");
var 显示="";
var 菜单=function(){
显示="";
var 选项=[["项目","","长跑","跳高"],["学院","","语文院","数学院"],["名次","","第一名","第二名","第三名"]];
for(var i=0;i<选项.length;i++){
var 子选项=选项[i];
显示+=子选项[0]+'<select id="'+子选项[0]+'">';
for(var j=1;j<子选项.length;j++){
显示+='<option value="'+子选项[j]+'">'+子选项[j]+'</option>';
}
显示+='</select>'
}
显示+=
'<input type="button" value="录入" onclick="录入()" />'+'<input type="button" value="查询" onclick="查询()" />';
document.getElementById("显示").innerHTML=显示;
显示表("select * from 成绩");
}
var 录入=function(){
var 项目=document.getElementById("项目").value;
var 学院=document.getElementById("学院").value;
var 名次=document.getElementById("名次").value;
添加数据([项目,学院,名次]);
显示表("select * from 成绩");
}
var 查询=function(){
var 项目=document.getElementById("项目").value;
var 学院=document.getElementById("学院").value;
var 名次=document.getElementById("名次").value;
var sql="";
switch(true){
case 项目!="":
sql="select * from 成绩 where 项目='"+项目+"'";
显示表(sql);
break;
case 学院!="":
sql="select * from 成绩 where 学院='"+学院+"'";
显示表(sql);
break;
}
}
function 显示表(sql语句){
数据库.transaction(function(数据库事务){
数据库事务.executeSql(sql语句,[],function(数据库事务,查询结果集){
if(查询结果集.rows.length>0){
var 结果="<tr>";
for(var j in 查询结果集.rows.item(0))结果+="<td>"+j+"</td>";
结果+="</tr>";
for(var i=0;i<查询结果集.rows.length;i++){
var 数据行=查询结果集.rows.item(i);
结果+="<tr>";
for(var j in 数据行)结果+="<td>"+数据行[j]+"</td>";
结果+="</tr>";
}
数据表.innerHTML=结果;
}
});
});
}
function 添加数据(数组){
数据库.transaction(function(数据库事务){
数据库事务.executeSql('INSERT INTO 成绩 VALUES(?,?,?)',数组);
});
}
菜单();
</script>
</html>