JSQL应用案例:基于客户端的成绩统计
下面我把整个example的代码贴出来,
欢迎拍砖:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>Marks Count</title><script type="text/javascript" src="../src/YESBRAIN.js"></script><script type="text/javascript" src="../src/JSQL.js"></script><script type="text/javascript" src="../src/JSQL-Memory.js"></script><script type="text/javascript" src="../src/JSQL-DOM.js"></script><style>#marks input {width: 100px;}</style></head><body><center><h1>Marks Count</h1><p><button onclick="insertline();"> Add one line </button><button onclick="savemarks();"> Save Changes </button><span>By<span><select id="byfield"><option value="chinese" selected="selected">Chinese</option><option value="math">Math</option><option value="english">English</option></select><select id="ascdesc"><option value="desc" selected="selected">Desc</option><option value="asc">Asc</option></select><button onclick="order();">Order</button></p><form name="marks" id="marks"><span>Name:</span><input type="text" id="name[1]" value="zhangsan"><span>Sex:</span><input type="text" id="sex[1]" value="female"><span>Chinese:</span><input type="text" id="chinese[1]" value="96"><span>Math:</span><input type="text" id="math[1]" value="94"><span>English:</span><input type="text" id="english[1]" value="98"><br></form></center><script type="text/javascript">var marks = [{name: 'Lisi',sex: 'Female',chinese: '88',math: '90',english: '92'},{name: 'Wangwu',sex: 'Female',chinese: '92',math: '80',english: '82'},{name: 'Lilei',sex: 'Female',chinese: '93',math: '88',english: '87'},{name: 'HanMeimei',sex: 'Male',chinese: '97',math: '92',english: '100'},{name: 'Wangjuan',sex: 'Male',chinese: '92',math: '93',english: '90'}];function addto(index,name,sex,chinese,math,english) {"insert into marks (nodename,innerHTML) values ('span','Name:')".ForDOM().execute();("insert into marks (nodename,type,id,value) values ('input','text','name[" + (index) + "]','" + name + "')").ForDOM().execute();"insert into marks (nodename,innerHTML) values ('span','Sex:')".ForDOM().execute();("insert into marks (nodename,type,id,value) values ('input','text','sex[" + (index) + "]','" + sex + "')").ForDOM().execute();"insert into marks (nodename,innerHTML) values ('span','Chinese:')".ForDOM().execute();("insert into marks (nodename,type,id,value) values ('input','text','chinese[" + (index) + "]','" + chinese + "')").ForDOM().execute();"insert into marks (nodename,innerHTML) values ('span','Math:')".ForDOM().execute();("insert into marks (nodename,type,id,value) values ('input','text','math[" + (index) + "]','" + math + "')").ForDOM().execute();"insert into marks (nodename,innerHTML) values ('span','English:')".ForDOM().execute();("insert into marks (nodename,type,id,value) values ('input','text','english[" + (index) + "]','" + english + "')").ForDOM().execute();("insert into marks (nodename) values ('br')").ForDOM().execute();};for(var i=0; i<marks.length;i++) {addto(i+2,marks[i].name,marks[i].sex,marks[i].chinese,marks[i].math,marks[i].english);};function insertline() {var count = "select count(*) as Count from marks where id like 'name%'".ForDOM().query();var index = count[0].Count + 1;addto(index,"","","","","");};function dellastline() {var count = "select count(*) as Count from marks where id like 'name%'".ForDOM().query();var index = count[0].Count;("delete from marks where id like '%["+ index +"]'").ForDOM().execute();};"create table savedmarks".execute();function savemarks() {var names = ("select value from marks where id like 'name%'").ForDOM().query();var sexs = ("select value from marks where id like 'sex%'").ForDOM().query();var chineses = ("select value from marks where id like 'chinese%'").ForDOM().query();var maths = ("select value from marks where id like 'math%'").ForDOM().query();var englishs = ("select value from marks where id like 'english%'").ForDOM().query();"delete from savedmarks".execute();for(var i=0;i<names.length;i++) {("insert into savedmarks (name,sex,chinese,math,english) values ('"+ names[i].value +"','" + sexs[i].value + "'," + chineses[i].value + "," + maths[i].value + "," + englishs[i].value + ")").execute();};//alert(savedmarks);};function orderby(field,asc) {savemarks();var marks = ("select * from savedmarks order by " + field + " " + asc).query();"delete from marks".ForDOM().execute();for(var i=0; i<marks.length;i++) {addto(i+2,marks[i].name,marks[i].sex,marks[i].chinese,marks[i].math,marks[i].english);};};function order() {var byfield = document.getElementById("byfield").value;var ascdesc = document.getElementById("ascdesc").value;orderby(byfield,ascdesc);};</script></body></html>