如何在Chrome浏览器中触发deviceready事件(尝试调试phonegap项目)

Max*_*Max 58 javascript google-chrome cordova

我正在开发一个PhoneGap应用程序,我希望能够在Chrome中而不是在手机上调试它.但是,我在onPviceReady()函数中初始化我的代码,该函数在PhoneGap触发"deviceready"事件时触发.由于Chrome不会触发此事件,因此我的代码无法初始化.

这是我的代码的精简版:

var dashboard = {};

$(document).ready(function() {
    document.addEventListener("deviceready", dashboard.onDeviceReady, false);
}); 

dashboard.onDeviceReady = function() {
    alert("hello!"); //this is never fired in Chrome
};
Run Code Online (Sandbox Code Playgroud)

我尝试过使用StopGap代码,它基本上只执行以下操作:

var e = document.createEvent('Events'); 
e.initEvent("deviceready");
document.dispatchEvent(e);
Run Code Online (Sandbox Code Playgroud)

但是当我在Chrome javascript控制台中运行该代码时,"hello"警报仍然不会触发.我究竟做错了什么?或者Chrome不支持触发像设备准备的"自定义"事件?

Che*_*mik 70

将此代码添加到onLoad处理函数:

    if (navigator.userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry)/)) {
        document.addEventListener("deviceready", onDeviceReady, false);
    } else {
        onDeviceReady();
    }
Run Code Online (Sandbox Code Playgroud)

事件"deviceready"在cordova.js中被触发,所以我不知道在应用程序代码中检测此事件是否存在的方法.

  • 这绝对有效.知道它会阻止您使用设备浏览器将您的应用程序测试为基于Web的应用程序(即iPhone上的Safari等).我将把我的功能作为答案,以防万一这对其他任何人都很重要. (2认同)

Max*_*Max 14

结束了拔出StopGap代码并引入了一个小延迟(让代码在一个单独的脚本中运行,而不是特定于页面的代码):

window.setTimeout(function() {
    var e = document.createEvent('Events'); 
    e.initEvent("deviceready", true, false); 
    document.dispatchEvent(e);
}, 50);
Run Code Online (Sandbox Code Playgroud)

  • 延迟更新:e.initEvent现在需要更多参数,e.initEvent('deviceready',true,false) (3认同)

kir*_*irb 8

使用Ripple移动仿真器.它在Chrome网上应用店中免费提供.安装后,导航到要测试它的页面,右键单击页面并选择Ripple Mobile Emulator> Enable.出现提示时,选择PhoneGap.

模拟器很好,但它仍处于测试阶段,因此尚未实现所有功能.

广告@米

  • 我看过Ripple ......但问题是他们不支持使用file:/// path/to/html来访问Chrome上的本地文件.我也希望能够在网上演示应用程序,而无需进行大量的代码重写,因此找出一些方法来启动deviceready事件似乎是最好的方法... (3认同)
  • 要修复它,请转到`about:flags`并启用对file:// urls的访问权限,然后重新启动Chrome.如果您在列表中看不到,请在桌面上复制Chrome快捷方式,并将"--allow-access-file-urls"添加到目标文本框中.广告@米 (2认同)

jer*_*one 8

对于我的移动网站和移动应用程序,我使用以下代码与jQuery:

function init() { ... };
if ("cordova" in window) {
    $(document).on("deviceready", init);
} else {
    $(init);
}
Run Code Online (Sandbox Code Playgroud)


小智 7

我使用Safari进行调试并执行此操作:

//my standard PG device ready
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
//debug("onDeviceReady")
getDefaultPageSetup();

}

//then add this (for safari
window.onload = function () {
if(! window.device)
    onDeviceReady()
}
Run Code Online (Sandbox Code Playgroud)


bla*_*man 5

user318696拥有我想要的魔术。“设备”是在cordova中定义的,在浏览器(非phoneGap应用程序包装器)中未定义。

编辑:

我遇到了一种情况,科尔多瓦花了很长时间在设备上进行初始化,并且此处的“原始”答案不再有效。在浏览器中运行测试时,我继续要求在URL上输入参数。(在示例中,我正在原始页面的网址中查找“ testing =“)

$(document).ready(function () {

    // ALWAYS LISTEN
    document.addEventListener("deviceready", main, false);

    // WEB BROWSER
    var url = window.location.href;
    if ( url.indexOf("testing=") > -1 ) {
        setTimeout(main, 500);
    }

});
Run Code Online (Sandbox Code Playgroud)

原版的:

我还没有足够深入地了解这个信任有多长时间[在将来的版本中,他们可以在浏览器中开始定义“设备”吗?]但是至少在2.6.0以下是安全的:

$(document).ready(function () {
    // call main from Cordova
    if ( window.device ) {
        document.addEventListener("deviceready", main, false);
    }

    // from browser
    else {
        main();
    }
});
Run Code Online (Sandbox Code Playgroud)