大佬教程收集整理的这篇文章主要介绍了Html5使用sqllite数据库实现Web留言本，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
| sqllite.html |
<!DOCTYPE html> <head lang="en"> <Meta charset="UTF-8"<title>sqllite使用数据库实现Web留言本</script src="sqllite.js"></script</headbody onload="init()"table> tr> td>姓名：</><input type="text" id="name"> </>留言："memo"> "button" value="删除" onclick="deleteData()保存" "saveData()hr/> table "datatable" border="1"<p "msg"pbody>
|
sqllite.js |
/** * Created by Administrator on 2016/3/13. */ var datatable = null; //使用openDatabase方法来创建一个访问数据库的对象 var db = @H_693_489@openDatabase('MyData','','My Database',102400); // 初始化操作 function init() { datatable = document.@H_693_489@getElementById("datatable"); showAllData(); } // 删除所有数据 function removeAllData() { for (var i =datatable.childNodes.length-1; i>=0; i--) { datatable.@H_693_489@removeChild(datatable.childNodes[i]); } var tr = document.@H_693_489@createElement('tr'); var th1 = document.@H_693_489@createElement('th'); var th2 = document.@H_693_489@createElement('th'); var th3 = document.@H_693_489@createElement('th'); th1.innerHTML = '姓名'; th2.innerHTML = '留言'; th3.innerHTML = '时间'; tr.@H_693_489@appendChild(th1); tr.@H_693_489@appendChild(th2); tr.@H_693_489@appendChild(th3); datatable.@H_693_489@appendChild(tr); } // 展示每行数据 function showData(row) { var tr = document.@H_693_489@createElement('tr'); var td1 = document.@H_693_489@createElement('td'); td1.innerHTML = row.@H_693_489@name; var td2 = document.@H_693_489@createElement('td'); td2.innerHTML = row.message; var td3 = document.@H_693_489@createElement('td'); var t = new Date(); t.@H_693_489@setTime(row.@H_693_489@time); td3.innerHTML=t.@H_693_489@toLocaleDateString()+" "+t.@H_693_489@toLocaletimestring(); tr.@H_693_489@appendChild(td1); tr.@H_693_489@appendChild(td2); tr.@H_693_489@appendChild(td3); datatable.@H_693_489@appendChild(tr); } // 展示所有数据 function showAllData() { db.@H_693_489@transaction(function(tX) { tx.@H_693_489@executesql('create table IF NOT EXISTS MsgData(name TEXT,message TEXT,time IntegeR)',[]); tx.@H_693_489@executesql('SELECT * FROM MsgData',[],function(tx,rs) { removeAllData(); for(var i = 0; i < rs.rows.length; i++) { showData(rs.rows.@H_693_489@item(i)); } }); }); } // 新增数据 function addData(name,message,timE) { db.@H_693_489@transaction(function(tX) { tx.@H_693_489@executesql('INSERT INTO MsgData VALUES(?,?,?)',[name,time],rs) { //document.getElementById("msg").innerHTML = "成功保存数据!"; }, function(tx,error) { @H_693_489@alert(error.source + "::" + error.message); }); }); } // 保存数据 function saveData() { var name = document.@H_693_489@getElementById('name').value; var @H_157_649@memo = document.@H_693_489@getElementById('memo').value; var time = new Date().@H_693_489@getTime(); addData(name,@H_157_649@memo,time); showAllData(); } // 删除表中数据 function deleteData(){ db.@H_693_489@transaction(function(tX){ tx.@H_693_489@executesql("deletE FROM MsgData",rs) { //alert("数据删除成功!"); },error) { @H_693_489@alert(error.source + "::" + error.message); }); }); showAllData(); } |
以上是大佬教程为你收集整理的Html5使用sqllite数据库实现Web留言本全部内容，希望文章能够帮你解决Html5使用sqllite数据库实现Web留言本所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。