logo标签列表

jQuery Mobile页面参数

jqueryjquery-mobile
4

我想知道如何向JQuery Mobile页面传递参数？

例如：

<div data-role="page-content">                                                      
         <ul class="gallery">   
                    <li><a href="#mypage?01"><img src="1.jpg"/></a></li>
                    <li><a href="#mypage/02"><img src="2.jpg"/></a></li>                           
         </ul>                        
</div><!-- /content -->

如您所见，我尝试了 # 和 ? 但它们无效。
谢谢。
3个回答
4
你可以通过以下方式实现：

I. 删除 <a> 标签。

II. 将内部页面转换为外部页面。

"#mypage" to "mypage.html"

III. 将图像的“Click”事件绑定到调用页面的函数。
$("#img1").click(function () {
      $.mobile.changePage("mypage.html", { data: { [...parameters...] } });
//eg: $.mobile.changePage("mypage.html", { data: { "param1": "value1" } });
});

IV. 在 MyPage.html 中使用以下代码

<div data-role="page" id="newPageId">
  <script type="text/javascript">
    $("#newPageId").on("pageshow", onPageShow);
    function onPageShow(e,data)
    {
        var url = $.url(document.location);

        var param1 = url.param("param1");
        var param2 = url.param("param2");
        :
    }
  </script>
</div>

您可以按照详细的教程进行操作。
您还可以查看这个问题以获取一些变化。请看答案。
谢谢，听起来这是一个有趣的方法。然而，我们决定使用backbone代替。https://github.com/ccoenraets/backbone-jquerymobile - DJSO
$.mobile.changePage已被弃用。 - ggDeGreat
0

我认为问题在于如何处理链接到内部页面时的参数。

以下是我解决这个问题时采用的方法：

    <div data-role="page-content">                                                      
      <ul class="gallery">   
        <li><a href="#mypage" data-my_param=1><img src="1.jpg"/></a></li>
        <li><a href="#mypage" data-my_param=2><img src="2.jpg"/></a></li>                           
      </ul>                        
    </div><!-- /content -->

然后...

    $('ul').on('click', 'a', function(e){
        myParam = $(this).data('my_param');            
        //do what ever needs to be done to the page with the param
    });
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接