将参数从电子邮件链接传递到jQuery移动Web应用程序

时间:2012-09-16 17:24:46

标签: email jquery-mobile url-parameters

我使用jquery mobile 1.1.1

创建了一个Web应用程序

作为我的应用程序的一部分,我构建了密码检索功能。如果用户需要重置密码,他们会填写表格并收到一封电子邮件,其中包含密码重置页面的地址和其他两个参数:

www.mywebapp.com/demo.html#resetPassword?x=123&y=123

初始问题: 当用户点击链接时,他们会看到Web应用程序的主页,即使地址栏中的URL显示:www.mywebapp.com/demo.html#resetPassword?x = 123& y = 123我明白了jQuery在hash之后,mobile不支持传递参数,所以我提出了以下解决方案。

解决方案带来一点不便: 我把以下代码放在一起,它读取URL,捕获我的两个参数并将用户重定向到密码重置页面:

$( document ).bind( "pagebeforeshow", function() {
    //cpe("parameter") will check whether the specified URL parameter exists
    if(cpe("x") && cpe("y")){
        //gpv("parameter") captures the value of the specified URL parameter
        recovery.username=gpv("x");
        recovery.token=gpv("y");
        $.mobile.changePage("#resetPassword");
    }
})

不便,以及我目前的问题: 当用户点击电子邮件中的链接时,浏览器将启动并打开应用程序的主页面,然后快速显示#resetPassword页面。我知道这是因为我正在更改页面

$.mobile.changePage("#resetPassword");

但是,如何修改上述代码,以便用户根本看不到主页面,直接进入#resetPassword页面?

2 个答案:

答案 0 :(得分:0)

使用没有内容的空初始页面。默认情况下,将changePage更改为 您的初始页面,但在其他情况下,例如resetPassword情况,则将changePage更改为该页面。

答案 1 :(得分:0)

我跟随Raymond Camden的suggestion并将以下内容添加到我的html中:

<pre>

<!--Start of blank initial page: #initPage-->
<div data-role="page" id="initPage">
    <div data-role="content"></div>
</div>
<!-- /page -->

</pre>

我还在javascript中添加了以下内容:

//init page -> path control hub
$( document ).bind( "pagebeforeshow", function() {
    var pageid=$.mobile.activePage.attr('id');
    if(pageid=="initPage"){
        if(cpe("x") && cpe("y")){
            recovery.username=gpv("x");
    recovery.token=gpv("y");
    $.mobile.changePage("#resetPassword");
    }else{
                $.mobile.changePage("#info");
                }
    }
})

现在正在运作。