<!DOCTYPE HTML><html xmlns="http://www.w3.org/1999/xhtml"><head><meta charset="utf-8"><title>Web Storage</title><script src="js/demo1.js" type="text/javascript"></script></head><body><h1>使用数据库实现Web留言本</h1><table> <tr><td>姓名:</td><td><input type="text" id="name"></td></tr> <tr><td>留言:</td><td><input type="text" id="memo"></td></tr> <tr> <td></td> <td><input type="button" value="保存" onClick="saveData()"></td> </tr></table><hr><table id="datatable" border="1"></table><p id="msg"></p></body></body></html>// JavaScript Documentvar datatable = null;var db = openDatabase('MyData','','My Database',102400);function init(){ datatable = document.getElementById("datatable"); showAllData(); }function removeAllData(){ for(var i = datatable.childNodes.length-1;i>=0;i--){ datatable.removeChild(datatable.childNodes[i]); } var tr = document.createElement('tr'); var th1 = document.createElement('th'); var th2 = document.createElement('th'); var th3 = document.createElement('th'); th1.innerHTML = "姓名"; th2.innerHTML = "留言"; th3.innerHTML = "时间"; tr.appendChild(th1); tr.appendChild(th2); tr.appendChild(th3); datatable.appendChild(tr); }function showData(row){ var tr = document.createElement('tr'); var td1 = document.createElement('td'); td1.innerHTML = row.name; var td2 = document.createElement('td'); td2.innerHTML = row.message; var td3 = document.createElement('td'); var t = new Date(); t.setTime(row.time) td3.innerHTML = t.toLocaleDateString()+""+t.toLocaleTimeString(); tr.appendChild(td1); tr.appendChild(td2); tr.appendChild(td3); datatable.appendChild(tr); }function showAllData(){ db.transaction(function(tx){ tx.executeSql('CREATE TABLE IF NOT EXISTS MSgData(name TEXT, maeeage TEXT,time TEXT)',[]); tx.executeSql('SELECT * FROM MsgData',[],function(tx,rs){ removeAllDate(); for(var i = 0; i< rs.rows.length;i++){ showData(rs.rows.item(i)); } }); }); }function addData(name,message,time){ db.transaction(function(tx){ tx.executeSql('INSERT INTO MsgData VALUES(?, ?, ?)',[name,message,time],function(tx,rs){ alert("成功保存数据！");}, function(tx,error){ alert(error.source + "::" + error.message); }); }); }function saveData(){ var name = document.getElementById('name').value; var memo = document.getElementById('memo').value; var time = new Date().getTime(); addDate(name,memo,time); showAllData(); }
添加回答
举报
0/150
提交
取消