Question

我正在开发一些演示应用程序来学习Jquery Mobile中的东西。我已经尝试了很多选项，但却无法解决一些问题： -

http://jsfiddle.net/sahil20grover1988/zZMXQ/48/在这种情况下，当我在网页中添加参数网址时，它不会指向搜索页面
如果我不将Params添加到索引页面，那么如何将参数从索引页传递到搜索页< /强>

我还需要帮助如何检索搜索页面中的参数 ??

Answer 1

这有帮助吗？

http://jsfiddle.net/phillpafford/VXV3R/

JS

$('#page2').live('pageshow', function(event, ui) {
    alert('Page 2 - CID: ' + getParameterByName('cid'));
});

function getParameterByName(name) {
    var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
    return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}

HTML

<div data-role="page" id="home">
    <div data-role="content">
        <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="f">
            <li data-role="list-divider">
                Home Page
            </li>
            <li>
                <a href="?cid=1234#page2" rel="external">Page 2</a>
            </li>
        </ul>                
    </div>
</div>
<!-- page 2 -->
<div data-role="page" id="page2">
    <div data-role="content">
        <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="f">
            <li data-role="list-divider">
                Page 2
            </li>
            <li>
                <a href="?cid=4321#home">Home Page</a>
            </li>
        </ul>
    </div>
</div>

Answer 2

我想出了这个简单的方法......

首先将自定义HTML5属性添加到第1页的元素以保存要传递的数据。我的属性名为data-parm

<div data-role="page" id="one">
    <div data-role="content">
        <ul data-role="listview" data-theme="c">
        <li><a data-parm="john" href="#two">one</a></li>
        <li><a data-parm="mary" href="#two">two</a></li>
        <li><a data-parm="sue" href="#two">three</a></li>
        </ul>
    </div>
</div>   

<div data-role="page" id="two">
    <div data-role="content">
        <div id="showParmHere"></div>
    </div>
</div>

在您的javascript中，创建一个单击处理程序（或其他类型的处理程序），用于选择属性并将值分配给可在第2页上使用的变量。

对于此示例，我已将其添加到第2页上的div的html中。

$("a").on("click", function (event) {

   var parm = $(this).attr("data-parm");
   //do something here with parameter on page 2 (or any page in the dom)
   $("#showParmHere").html(parm);

});

Answer 3

要在jQuery mobile中传递带url的valor，你可以使用rel =＆＃34; external＆＃34; ...

示例：

<a id="l" href="index.html?id='1234'#dateA" rel="external">

你可以看到： http://demos.jquerymobile.com/1.2.0/docs/pages/page-links.html

Answer 4

我偶然发现了这个问题，因为同样的问题，但我想我找到了一个更简单的方法。至少如果您使用“pagebeforechange”事件。那是我到目前为止尝试解决方案的地方。

您可以通过此对象路径从“.ontions.link.context.search”获取pageonchange事件函数的第二个参数中的搜索字符串。我希望示例代码足以解释它。

$(document).live("pagebeforechange", function(e, secondparameter) {
  alert(secondparameter.options.link.context.search);
});

Answer 5

我为jQM 1.4+创建了一个解决方案，允许通过URL传递参数。如果您希望用户能够直接转到带参数的页面（例如来自电子邮件），或者用户刷新页面，那么这非常有效。

根据麻省理工学院的许可证，您可以找到here on GitHub。

如何在Jquery Mobile中的两个页面之间传递和获取参数？

5 个答案: