【问题标题】:Passing Parameters from e-mail link to jQuery mobile web app将参数从电子邮件链接传递到 jQuery 移动 Web 应用程序
【发布时间】:2012-09-16 17:24:46
【问题描述】:

我使用 jquery mobile 1.1.1 创建了一个网络应用程序

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

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

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

有一点不便的解决方案: 我将以下代码放在一起,它读取 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 页面?

【问题讨论】:

  • 如果您仍在寻找一个干净的解决方案来解决这个问题,我最近为此创建了一个plug-in

标签: email jquery-mobile url-parameters


【解决方案1】:

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

【讨论】:

    【解决方案2】:

    我关注了 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");
                    }
        }
    })
    

    现在可以了。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2013-03-27
      • 2022-12-20
      • 2013-02-04
      • 2023-03-14
      • 1970-01-01
      • 2016-12-12
      • 1970-01-01
      相关资源
      最近更新 更多