pagecreate不起作用

时间:2014-06-02 06:36:44

标签: javascript jquery events jquery-mobile cordova

每当我试图跑步时,他们都会弹出“Uncaught TypeError: Cannot call method 'changePage' of undefined”错误。我认为loginPage创建中存在错误。任何人请帮助解决以下错误。任何帮助,将不胜感激。感谢

    function deviceReady() {
        console.log("deviceReady");
        $(document).on("pagecreate", "#loginPage", function () {
            alert("pageinit run");
            $("#loginForm").on("submit", handleLogin);
            checkPreAuth();
        });
        $.mobile.changePage("#loginPage", {
            transition: "pop",
            reverse: false,
            changeHash: false
        });
    }

1 个答案:

答案 0 :(得分:1)

发生了什么

你做错了什么。

首页事件不应该在Cordova / Phonegap deviceReady()函数内调用,没有意义。将它移到上面,此代码不关心设备是否准备好,它将在您转换到页面 #loginPage 时执行。这通常是在Phonegap处于 deviceReady()状态后的方式。

第二件事,你不能在 deviceReady()函数中执行changePage函数。 jQuery Mobile未正确初始化,也没有页面容器可用。因此,如果DOM中没有事件,则无法更改页面。

第三件事,假设假设页面容器在 deviceReady()状态期间可用(这不是真的),这仍然无效,因为此时jQuery Mobile将尝试初始化第一页内部初始HTML文件,你不能只用另一个更改页面停止它。

基本上你的代码看起来应该类似于:

function deviceReady() {
    console.log("deviceReady");
}

$(document).on("pageshow", "#someInitialPage", function () {
    $.mobile.changePage("#loginPage", {
        transition: "pop",
        reverse: false,
        changeHash: false
    });
});

$(document).on("pagecreate", "#loginPage", function () {
    alert("pageinit run");
    $("#loginForm").on("submit", handleLogin);
    checkPreAuth();
});

我们学到了什么

  • 永远不要混用像这样的Phonegap和jQuery Mobile代码,它们应该总是单独运行,除非有很好的理由将它们混合起来
  • 页面事件应始终单独运行
  • 在首页初始化之前,您无法启动更改页面(只有一种方式,但只有在您需要的时候才会向您显示)
  • changePage 只能在某些页面事件期间或在某些页面事件期间初始化的任何函数中初始化。基本上,页面容器必须存在才能发生 pageChange

如果你真的需要在初始化Phonegap和jQuery Mobile时运行一些代码,那么使用以下代码:

var deviceReadyDeferred = $.Deferred();
var jqmReadyDeferred = $.Deferred();

document.addEventListener("deviceReady", deviceReady, false);

function deviceReady() {
  deviceReadyDeferred.resolve();
}

$(document).one("mobileinit", function () {
  jqmReadyDeferred.resolve();
});

$.when(deviceReadyDeferred, jqmReadyDeferred).then(doWhenBothFrameworksLoaded);

function doWhenBothFrameworksLoaded() {
  // TBD
}   

如果要确定首先加载哪个初始页面,请使用此代码

此代码可以阻止初始页面初始化,您可以使用它来加载任何其他页面:

$(document).on('pagebeforechange', function(e, data){ 
    var to = data.toPage;

    if (typeof to  === 'string') {
        var u = $.mobile.path.parseUrl(to);
        to = u.hash || '#' + u.pathname.substring(1);

        if (to === '#second') {
            alert('Can not transition the page #second!');
            e.preventDefault();
            e.stopPropagation();

            // remove active status on a button, if transition was triggered with a button
            $.mobile.activePage.find('.ui-btn-active').removeClass('ui-btn-active ui-shadow').css({'box-shadow':'0 0 0 #3388CC'});
        } 
    }
});

详细了解here