将参数传递给 jQuery Mobile 中的页面 ID [英] Passing parameters to a page-id in jQuery Mobile

问题描述

我正在尝试将一些参数传递给在 jQuery Mobile 中创建的页面 ID.

I'm trying to pass some parameters to a page-id made in jQuery Mobile.

该站点由带有链接的列表视图组成，每个列表视图中都有哈希编码，如下所示:

The site is composed of list-views with links, each of them has the hash coded in it, like this:

<li><a href="#pronostico?region=12&ciudad=0">Puerto Natales</a></li>

我绑定了 pagebeforechange 来捕获 URL 中的哈希值，进行参数检测并根据传递的参数数量采取行动.

I have binded pagebeforechange to catch hashes in the URL, do parameter detection and take action depending on the amount of parameters passed.

现在，我一直在尝试使用 cookie:

Now, with cookies, I've been trying this:

$(document).one("pageinit", function(event, data) {
  if (location.hash.search(/^(#ciudades|#pronostico)/) === -1) {
    if ($.cookie("recordar")) {
      $.mobile.changePage($("#pronostico"), {
        data: "region=" + $.cookie("region") + "&ciudad=" + $.cookie("ciudad")
      });
    }
  }
});

但它只是将我传递给 #pronostico 页面 ID，哈希中没有参数.结果，我得到的页面没有它应该显示的信息.

But it just passes me to the #pronostico page-id, with no parameters in the hash. As a result, I get a page without the information it is supposed to show.

提前致谢.

推荐答案

是的，默认情况下不支持散列参数.我一直在使用以下插件来实现这一点，到目前为止它一直运行良好;-)

Yes, parameters on the hash are not supported by default. I've been using the following plugin to give me that, and it's been working pretty good so far ;-)

jqm.page.params

更新 - 如何使用:

我在包含 jqm.page.params.js 后添加了以下代码:

I've added the following code after including jqm.page.params.js:

$(document).bind("pagebeforechange", function( event, data ) {
    $.mobile.pageData = (data && data.options && data.options.pageData)
        ? data.options.pageData
        : null;
});

例如，一个页面被调用如下:index.html#search?id=mysearchkeyword现在可以在我认为的任何页面事件中访问此信息:

So for example, a page getting called like: index.html#search?id=mysearchkeyword Can now access this information in ANY page event I feel like:

$(document).on("pagebeforeshow", "#firstpage", function(e, data){ 
        if ($.mobile.pageData && $.mobile.pageData.id){
            console.log("Parameter id=" + $.mobile.pageData.id);
        }
 });

会将mysearchkeyword"打印到您的日志记录控制台.

Would print "mysearchkeyword" to your logging console.

希望这有帮助！

PS:请注意，我与插件或其作者没有任何关系

PS: Note that I am no way affiliated with the plugin or it's author

编者注:作者将此作为第二个代码块.在 Jquery 1.9 中，live 被删除，所以我用 .on 语法更新了上面的示例.这是原文:

Editors Note: The author had this as second code block. In Jquery 1.9, live is removed so i updated his sample above with a .on syntax instead. Here is the original:

$("#firstpage").live("pagebeforeshow", function(e, data){
    if ($.mobile.pageData && $.mobile.pageData.id){
        console.log("Parameter id=" + $.mobile.pageData.id);
    }
});

这篇关于将参数传递给 jQuery Mobile 中的页面 ID的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！