在 PhoneGap 中创建表并存储数据

在之前的章节中，我们学习了如何使用 localStorage 对象从移动设备存储和检索数据。在本节中，我们将学习最复杂的功能，即 SQLite 数据库。如果我们之前使用过数据库，那么使用它将会非常容易。

在 PhoneGap 中，有一个完全 SQL 兼容的数据库，它存在于我们的应用程序中，并在设备上存储数据。对于不适用于本地存储的更复杂的信息，它将非常有用。它是一种文件格式。以下是用于创建和存储数据的步骤

1) 创建一个新项目

首先，我们将使用空白模板创建一个新的 PhoneGap 项目。如果您不知道如何使用空白模板创建应用程序，请浏览 PhoneGap 项目链接。

2) 创建一个表单

现在，我们将创建一个表单或用户界面，以从用户处获取数据。在这个表单中，我们将添加两个用于姓名和电子邮件的文本字段，并为每个字段添加一个标签。我们还将添加两个用于检索和存储数据的按钮。表单将如下所示

3) 创建 window.onload 函数

我们将在我们的 JQuery 移动库下面创建 window.onload 函数。当窗口屏幕加载时，将自动调用此函数。在此函数中，我们将使用 id 获取保存按钮，并添加一个事件来调用 saveData 函数。window.onload 函数将在 <script></script> 标签 之间进行编码，如下所示

当窗口屏幕加载时，我们的数据库也将同时打开。因此，我们还将使用 window.openDatabase 在相同的 window.onload 函数中为打开数据库编写代码。此函数包含四个参数，即数据库名称、版本、描述和数据库的大小（以字节为单位）。我们将以以下方式使用此函数

4) 创建 saveData 函数

现在，我们将创建 saveData 函数，该函数带有一个参数。此参数的名称可以是任何名称。我们将创建 transaction 函数，该函数将由数据库对象 db 运行。此 transaction 函数将回调另外三个函数，即 saveRecord、onSuccess 和 onError。

5) 创建 saveRecord 函数

现在，我们将创建第一个回调函数，即 saveRecord。此函数将 transaction 作为参数。在此函数中，我们将从用户界面获取数据，然后我们将创建一个表来存储我们的数据，使用 executeSql 函数，如下所示

接下来，我们将创建另一个 SQL 语句。我们将使用 insert SQL 语句将数据插入到表中。此语句将通过 executeSql 函数在数据库中执行，并将其编码为

6) 创建 onSuccess 和 onError 函数

当我们的数据存储在数据库中时，将调用 onSucess 函数，当出现错误或 bug 时，将调用 onError 函数。这两个函数将以以下方式编码

我们可以使用浏览器查看我们存储的数据。我们必须进入 开发人员工具，在存储部分，我们可以看到我们的数据库、表和我们的数据。

在下一节中，我们将学习如何从 SQLite 数据库检索数据。