phonegap-storage

最新推荐文章于 2025-07-08 15:16:11 发布

iteye_13768

最新推荐文章于 2025-07-08 15:16:11 发布

阅读量104

点赞数

分类专栏： html54mobile 文章标签： phonegap html5 mobile

html54mobile 专栏收录该内容

8 篇文章

订阅专栏

本文通过两个简单的页面演示了如何使用PhoneGap进行本地数据库操作，包括创建表、插入记录、查询记录及删除记录等基本的CRUD操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

phonegap 就不多做介绍了，在此你看到的文章的分类就略知其作用了。
本节介绍的phonegap的存贮的实现，比较奇怪的是我始终都没有找到其存储文件存放的目录在哪里，原本以为会在/data/data/app package/databases/ 其实不然，在stackoverflow，gmailgroup里面都提问了，尚未得到有效的答复。希望有经验的朋友能够在此留言告知于我，表示感谢！
其实就两个页面，实现CRUD的操作，so easy！
index.html


<!DOCTYPE html>
<html>
<head>
<title>Storage Example</title>

<script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
<script type="text/javascript" charset="utf-8">
	// Wait for Cordova to load
	//
	document.addEventListener("deviceready", onDeviceReady, false);

	// Populate the database 
	//
	function populateDB(tx) {
			//tx.executeSql('DROP TABLE IF EXISTS DEMO');
			tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id integer PRIMARY KEY autoincrement, title text,content text)');
			//tx.executeSql('INSERT INTO DEMO (title,content) VALUES ("First row","first content")');
			//tx.executeSql('INSERT INTO DEMO (title,content) VALUES ("Second row","second content")');
	}

	// Query the database
	//
	function queryDB(tx) {
		tx.executeSql('SELECT * FROM DEMO', [], querySuccess, errorCB);
	}

	// Query the success callback
	//
	function querySuccess(tx, results) {
		var len = results.rows.length;
		var div = "<table>";
		console.log("DEMO table: " + len + " rows found.");
		for ( var i = 0; i < len; i++) {
			console.log("Row = " + i + " ID = " + results.rows.item(i).id
					+ " Data =  " + results.rows.item(i).title);
			div += "<tr><td>" + i + "</td>" + "<td>" + results.rows.item(i).id
					+ "</td>" + "<td>" + results.rows.item(i).title + "</td>"
					+ "<td>" + results.rows.item(i).content + "</td>"
					+ "<td><a href='#' onclick='deletes("
					+ results.rows.item(i).id + ");'>delete</a></td></tr>";
		}
		div += "</table>";
		document.getElementById("div").innerHTML = div;
	}

	var index;

	function deletes(index_) {
		index = index_;
		var db = window.openDatabase("Database", "1.0", "Cordova Demo", 200000);
		db.transaction(deletes_, errorCB, successCB);
	}
	function deletes_(tx) {
		tx.executeSql('delete FROM DEMO where id = ' + index, [], querySuccess,
				errorCB);
	}

	// Transaction error callback
	//
	function errorCB(err) {
		console.log("Error processing SQL: " + err.code);
	}

	// Transaction success callback
	//
	function successCB() {
		var db = window.openDatabase("Database", "1.0", "Cordova Demo", 200000);
		db.transaction(queryDB, errorCB);

		console.log("Success processing SQL: ");
	}

	// Cordova is ready
	//
	function onDeviceReady() {
		var db = window.openDatabase("Database", "1.0", "Cordova Demo", 200000);
		db.transaction(populateDB, errorCB, successCB);
	}

	function display() {
		var db = window.openDatabase("Database", "1.0", "Cordova Demo", 200000);
		db.transaction(queryDB, errorCB);
	}

	function search() {
		var db = window.openDatabase("Database", "1.0", "Cordova Demo", 200000);
		db.transaction(search_, errorCB, querySuccess);
	}

	function search_(tx) {
		var key = document.getElementById("keywords").value;
		console.log("key: " + key);
		tx.executeSql("SELECT * FROM DEMO where title like '%" + key + "%'",
				[], querySuccess, errorCB);
	}
</script>
</head>
<body>
	<h1>Example</h1>
	Database


	[url=add.html]Add[/url]

	<input name="keywords" id="keywords" placeholder="search something">
	<input type="submit" onclick="search();" />

	<div id="div"></div>

</body>
</html>

add.html


<!DOCTYPE html>
<html>
  <head>
    <title>Storage Example</title>

    <script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for Cordova to load
    //

    function inster(){

    	var db = window.openDatabase("Database", "1.0", "Cordova Demo", 200000);
        db.transaction(inster_, errorCB, successCB);
    }

    function inster_(tx){
    	var t = document.getElementById("title").value;
    	var c =  document.getElementById("content").value;
    	tx.executeSql("INSERT INTO DEMO (title,content) VALUES ('"+t+"','"+c+"')");
    }

    // Transaction error callback
    //
    function errorCB(err) {
        console.log("Error processing SQL: "+err.code);
    }

    // Transaction success callback
    //
    function successCB() {
        console.log("Success processing SQL: ");
    }

    </script>
  </head>
  <body>
    <h1>Example</h1>
    Database - Add


    Title:
    <input type="text" id="title"/>
    Content:
    <input type="text" id="content"/>
    <input type="submit" id="submit" value="submit" onclick="inster();"/>


  </body>
</html>