Phonegap存储无法正常工作

时间:2014-04-29 16:27:41

标签: javascript jquery html cordova

我尝试使用phonegap创建数据库和表。我跟着phonegap文档,但我做错了不能识别。任何能够意味着它对我有帮助。 我的代码在这里。

<!DOCTYPE html>
<html>
<head>
<title>Daily Word</title>
<link rel="stylesheet" href="../css/jquery.mobile-1.4.2.min.css">
<link rel="stylesheet" href="../css/style.css">
<script src="../js/jquery-1.9.1.js"></script>
<script src="../js/cordova.js"></script>
<script src="../js/jquery.mobile-1.4.2.min.js"></script>
<script>
    document.addEventListener("deviceready", onDeviceReady, false);

var db;
var user_type;

function onDeviceReady() 
{
    alert("Device Ready");
    db = Window.openDatabase("DailyWord","1.0","DailyWord DB",2*1024*1024);
    db.transaction(createDB,errorDB,successDB);
    alert("DB Query fired...");
}
//This will cereate the database
function createDB(tx)
{
    tx.executeSql('DROP TABLE IF EXISTS Login');
    tx.executeSql('CREATE TABLE IF NOT EXISTS Login (type)');
    tx.executeSql('CREATE TABLE IF NOT EXISTS DW_Words(id unique,status)');
    alert("DB Created");        
}
//This will report the error in the db connection
function errorDB(err)
{
    alert("Error in creating DB"+err.code);
}
//This will report the success state of db connection
function successDB()
{
    alert("DB Created");    
}
function insertUser(tx)
{
    var sql='INSERT INTO Login(type) VALUES (?)';
    tx.executeSql(sql,[user_type],SuccessQueryDB,errorDB);
}
function SuccessQueryDB(tx)
{
    alert("Query");
    tx.executeSql('SELECT * FROM Login',[],redirectUser,errorDB);
}
function redirectUser(tx,results)
{
    //var rows=results.rows.length;
    return "Success";
}
function checkConnection() {
    var networkState = navigator.connection.type;
    var states = {};
    states[Connection.UNKNOWN]  = 'Unknown connection';
    states[Connection.ETHERNET] = 'Ethernet connection';
    states[Connection.WIFI]     = 'WiFi connection';
    states[Connection.CELL_2G]  = 'Cell 2G connection';
    states[Connection.CELL_3G]  = 'Cell 3G connection';
    states[Connection.CELL_4G]  = 'Cell 4G connection';
    states[Connection.CELL]     = 'Cell generic connection';
    states[Connection.NONE]     = 'No Connection';
    return states[networkState];
}   
</script>
</head>
<body>
<div data-role="page" id="LoginPage">
    <div data-role="header" id="header"><h4>Daily Word</h4></div>
    <div data-role="content">
    <form>
    <fieldset>
    <input type="text" name="Username" class="Username" id="text-basic" value="arockia" onfocus="if (this.value == 'Username') this.value = '';" onblur="if (this.value == '') this.value = 'Username';">
    <input type="password" name="Password" class="Password" id="text-basic" value="arulbhuvi" onfocus="if (this.value == 'Password') this.value = '';" onblur="if (this.value == '') this.value = 'Password';">
    <input type="button" value="Login" name="btnLogin" id="btnSignIn">
    <input type="reset" value="Reset" name="btnClear">
    <a href="register.html" data-role="button" id="SignUp">Sign Up</a>
    </fieldset>
    </form>
    </div>
    <div data-role="footer" data-position="fixed" id="footer" ><h4><a href="http://eazytutor.in/Mobile/">EazyTutor</a></h4></div>
<script>
$("#LoginPage").on( 'pageinit' , function (event) {
    $("#btnSignIn").on( 'click', function(){
        var uname=$('.Username').val();
        var pwd=$('.Password').val();
                if(checkConnection() == "No Connection")
                {
                    alert("Please check internet connection");
                }
                else
                {       
                    $.get("http://eazytutor.in/DailyWord/login.php?Username="+uname+"&Password="+pwd,function(response){
                    if( response == "Admin" )
                        {
                            user_type=response;
                            db.transaction(insertUser,errorDB);
                            window.location.href ="Admin/admin_home.html";
                        }
                    else if( response == "User" )
                        {
                            user_type=response;
                            db.transaction(insertUser,errorDB);
                            window.location.href="User/index.html";
                        }
                    else
                        {
                            alert(response);
                        }
                    });
                }
    });   
});
</script>
</div>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

您需要将deviceready事件放在DOM完全加载后调用的函数中。这应该有所帮助:

<body onload="onLoad()">

function onLoad() {
    document.addEventListener("deviceready", onDeviceReady, false);
}

这是PhoneGap / Cordova的最佳做法,因为它减少了在PhoneGap准备好接受它们之前调用方法的可能性。

ALSO:

这一行:

<script src="../js/cordova.js"></script>

应该是:

<script src="cordova.js"></script>

这是因为PhoneGap / Cordova将在您运行build命令时添加此文件,并且它将始终添加到项目根目录。