HTML5本地数据库来做注册登录功能

来源：互联网发布：php直播系统源码编辑：程序博客网时间：2024/06/07 16:17

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>    </head>    <body>        用户名：<input type="text" name="" id="" value="" /> 密码：        <input type="password" name="" id="" value="" />        <input type="button" name="" id="btn" value="注册" />        <button type="button" id="clear">清除数据</button>    </body>    <script type="text/javascript">        var aInputs = document.getElementsByTagName('input');        var oClear = document.getElementById('clear');        var db = openDatabase('zuchedenglu', '1.0', 'textdb', '1024*1024');        db.transaction(function(contex) {            contex.executeSql('create table if not exists userinf(id unique,name,password)');        });        var oBtn = document.getElementById('btn');        var num = 0;        oBtn.onclick = function() {            if (aInputs[0].value && aInputs[1].value) {                db.transaction(function(contex) {                    contex.executeSql('select * from userinf', [], function(con, data) {                        var leg = data.rows.length,                            i;                        for (var i = 0; i < leg; i++) {                            if (aInputs[0].value == data.rows.item(i).name) {                                alert('该用户名已注册！');                                return;                            }                        }                        num =leg +1;                    });                    contex.executeSql('insert into userinf(id,name,password) values("' + num + '","' + aInputs[0].value + '","' + aInputs[1].value + '")');                    alert('注册成功');                });            } else {                alert('请填写完整的账号密码！');            }        }        oClear.onclick=function(){            db.transaction(function(contex) {                contex.executeSql('drop table userinf');            });        }    </script></html>

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>    </head>    <body>        用户名：<input type="text" name="" id="" value="" /> 密码：        <input type="password" name="" id="" value="" />        <input type="button" name="" id="btn" value="登陆" />        <button type="button" id="clear">清除数据</button>    </body>    <script type="text/javascript">        var aInputs = document.getElementsByTagName('input');        var oClear = document.getElementById('clear');        var db = openDatabase('zuchedenglu', '1.0', 'textdb', '1024*1024');        db.transaction(function(contex) {            //  tx.executeSql('drop table userinf');            //contex.executeSql('create table if not exists userinf(id unique,name,password)');            contex.executeSql('create table if not exists userinf(id integer primary key AutoIncrement,name,password)');        });        var oBtn = document.getElementById('btn');        var blogin = true;        oBtn.onclick = function() {            if (aInputs[0].value && aInputs[1].value) {                db.transaction(function(contex) {                    contex.executeSql('select * from userinf', [], function(con, data) {                        var leg = data.rows.length,                            i;                        for (var i = 0; i < leg; i++) {                            if (aInputs[0].value == data.rows.item(i).name && aInputs[1].value == data.rows.item(i).password) {                                blogin = false;                                break;                            }                        }                        if (blogin) {                            alert('请输入正确的账号和密码！');                        } else {                            alert('登陆成功！');                        }                    });                });            } else {                alert('请填写完整的账号密码！');            }        }        oClear.onclick = function() {            db.transaction(function(contex) {                contex.executeSql('drop table userinf');            });        }    </script></html>

阅读全文

0 0