请选择 进入手机版 | 继续访问电脑版
 找回密码
 立即注册
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <tile>实现Sqlite数据库实现Web留言</title>
    <script type="text/javascript">
        var datatable = null;
        var db = openDatabase(&#39;my_Data&#39;,&#39;&#39;,&#39;My Database&#39;,102400);
        function init() {
            datatable = document.getElementById("datatable");
            showAllData();
        }
        function removeAllData() {
            for(var i=datatable.childNodes.length-1;i>=0;i--) {
                datatable.removeChild(datatable.childNodes);
            }
            var tr = document.createElement(&#39;tr&#39;);
            var th1 = document.createElement(&#39;th&#39;);
            var th2 = document.createElement(&#39;th&#39;);
            var th3 = document.createElement(&#39;th&#39;);
            th1.innerHTML = &#39;姓名&#39;;
            th2.innerHTML = &#39;留言&#39;;
            th3.innerHTML = &#39;时间&#39;;
            tr.appendChild(th1);
            tr.appendChild(th2);
            tr.appendChild(th3);
            datatable.appendChild(tr);
        }
        function showData(row) {
            var tr = document.createElement(&#39;tr&#39;);
            var td1 = document.createElement(&#39;td&#39;);
            td1.innerHTML = row.name;
            var td2 = document.createElement(&#39;td&#39;);
            td2.innerHTML = row.message;
            var td3 = document.createElement(&#39;td&#39;);
            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() {
            //tx为transaction对象
            db.transaction(function(tx){
                tx.executeSql(&#39;CREATE TABLE IF NOT EXISTS MsgData(name TEXT,message TEXT,time INTEGER)&#39;,[]);
                //rs为执行查询操作时返回查询到的结果数据集对象
                tx.executeSql(&#39;SELECT * FROM MsgData&#39;,[],function(tx,rs){
                    removeAllData();
                    for(var i=0;i<rs.rows.length;i++){
                        showData(rs.rows);
                    }
                });
            });
        }
        function addData(name,message,time) {
            db.transaction(function(tx){
                tx.executeSql(&#39;INSERT INTO MsgData VALUES(?,?,?)&#39;,[name,message,time],function(tx,rs){
                    alert("成功保存数据。。。")
                },
                function(tx,error){
                    alert(error.source + "::" + error.message);
                });
            });
        }
        function saveData() {
            var name = document.getElementById(&#39;name&#39;).value;
            var memo = document.getElementById(&#39;memo&#39;).value;
            var time = new Date().getTime();
            addData(name,memo,time);
            showAllData();
        }
    </script>
</head>
<body onload="init()">
    <h1>使用Sqlite数据库实现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><input type="button" value="保存" onclick="saveData()"></td></tr>
    </table>
    <hr>
    <table id="datatable" border="1"></table>
    <p id="msg"></p>
</body>
</html>
请教下各位大侠,我这段代码在各个浏览器中不起作用,没有任何效果,是哪里出错了?
收藏

0 个回复

您需要登录后才可以回帖 登录 | 立即注册