简介
PhoneGap 是一个允许使用 HTML、CSS 和 JavaScript 进行移动应用程序开发的平台。当我们在使用 PhoneGap 开发时，通常需要在真实设备上进行测试和调试。但是如果想提高效率，则可以使用 Chrome 浏览器中的 deviceready 事件来调试 PhoneGap 项目。
deviceready事件
deviceready 事件是 Cordova 提供的事件之一，它会在设备准备就绪时触发。也就是说，当 PhoneGap 应用加载完毕并准备好与原生 API 进行交互时，该事件将被触发。
调试步骤
以下是在 Chrome 浏览器中使用 deviceready 事件进行 PhoneGap 项目调试的步骤：
安装 Chrome 浏览器扩展。 在 Chrome 应用商店中搜索“Ripple Emulator”并安装该扩展。
启动 Ripple Emulator。 点击 Chrome 工具栏中的插件图标，在弹出的窗口中选择 Ripple Emulator，并单击“Launch”按钮。
创建新的 PhoneGap 项目。 在命令行中输入以下指令以创建新的 PhoneGap 项目：
cordova create myapp com.example.myapp MyApp
- 添加 Android 平台。 在命令行中输入以下指令以添加 Android 平台：
cordova platform add android
启动 Ripple Emulator 中的 PhoneGap 项目。 在 Ripple Emulator 界面中，单击“New Project”按钮，并选择刚才创建的 PhoneGap 项目。
调试应用程序。 单击“Start Emulating”按钮并等待加载完成后，即可开始调试应用程序了。
打开 Chrome 开发者工具。 在 Chrome 浏览器中打开调试页面，并单击 F12 键进入开发者工具。
启用设备模式。 在开发者工具中，单击左上角的手机图标，并选择“Responsive（Device Mode）”选项。
选择要模拟的设备。 在“Device”下拉菜单中选择要模拟的设备。
触发 deviceready 事件。 在控制台中输入以下代码，手动触发 deviceready 事件：
var e = document.createEvent('Events');
e.initEvent('deviceready', true, false);
document.dispatchEvent(e);现在，您已经成功地在 Chrome 浏览器中使用 deviceready 事件来调试 PhoneGap 项目了。
示例代码
以下是一个简单的 PhoneGap 应用程序示例，其中包含一个按钮，单击该按钮将显示一条消息：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
--------------------
------- --------------------------
--------
---------------------------------------- -------------- -------
-------- --------------- -
------------------- --------
-
-------- ------------- -
------------ ---------
-
---------
-------
------
------- ---------------------------- ----------------
-------
-------结论
使用 Chrome 浏览器中的 deviceready 事件来调试 PhoneGap 项目可以提高开发效率。通过上述步骤，您可以轻松地在 Chrome 中模拟 PhoneGap 应用程序，并进行调试。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/13672