码迷,mamicode.com
首页 > 数据库 > 详细

【简单的留言本】用HTML新增的数据库实现

时间:2017-04-09 17:11:53      阅读:212      评论:0      收藏:0      [点我收藏+]

标签:ase   row   innerhtml   保存数据   web   null   ges   cal   ddd   

 使用数据库实现的WEB留言本

   

        var 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,message TEXT,time INTEGER)‘,[]);

                tx.executeSql(‘SELECT * FROM MsgData‘,[],function (tx,rs) {

                    removeAllData();

                    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,rs) {

                    alert(error.source+"::" + error.message);

                });

            });

        }

        function saveData() {

            var name = document.getElementById(‘name‘).value;

            var memo = document.getElementById(‘memo‘).value;

            var time = new Date().getTime();

            //alert(time);

            addData(name,memo,time);

            showAllData();

        }

   

 

 

   

使用数据库实现的Web留言本

   

 

       

 

           

姓名:

           

 

               

                   

               

           

       

       

 

           

留言:

           

 

               

                   

               

           

       

       

 

           

 

           

 

               

           技术分享

       

   

   

 

   

 

【简单的留言本】用HTML新增的数据库实现

标签:ase   row   innerhtml   保存数据   web   null   ges   cal   ddd   

原文地址:http://www.cnblogs.com/gq123456/p/6685200.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!