jQuery手机弹出式动态网址

Question

我在弹出窗口中遇到动态网址问题。在这里我的代码：

<!-- content --> 
<ul data-role="listview"> 
    <li data-role="list-divider">Group 1</li> 
     <li data-icon="false"><a href="person.php?id=1#popup-menu" data-rel="popup" data-transition="slideup">List 1a</a></li> 
     <li data-icon="false"><a href="person.php?id=2#popup-menu" data-rel="popup" data-transition="slideup">List 1b</a></li> 

    <li data-role="list-divider">Group 2</li> 
     <li data-icon="false"><a href="person.php?id=3#popup-menu" data-rel="popup" data-transition="slideup">List 2a</a></li> 
</ul><!-- /content --> 

<!-- popup-menu --> 
<div data-role="popup" id="popup-menu"> 
    <ul data-role="listview" style="min-width:210px;"> 
     <li data-role="divider">Choose an action</li> 
      <li><a href="#">View details</a></li> 
      <li><a href="#">Share</a></li> 
    </ul> 
</div><!-- /popup-menu --> 

基本上，当我点击我的弹出链接，我会去那里的被叫方的网址是页面。

所以，如果我点击表1A弹出的节目，然后我点击查看详情页面直接我到URL person.php？ID = 1

我怎样才能做到这一点？

我可以根据列表的数量只是创建弹出的div多次，但我认为这是DOM对象的浪费（我最后的手段，如果我没有找到任何优雅的解决方案）

感谢

Answer 1

因为你确实需要传递只有一个人弹出式窗口的ID，你可以实现你的目标是这样的：

所有首先简化您的ListView的标记并存储id中的锚的data-id属性列表视图项目

<ul data-role="listview" id="list"> 
    <li data-role="list-divider">Group 1</li> 
     <li data-icon="false"><a href="#" data-id="1">List 1a</a></li> 
     <li data-icon="false"><a href="#" data-id="2">List 1b</a></li> 

    <li data-role="list-divider">Group 2</li> 
     <li data-icon="false"><a href="#" data-id="3">List 2a</a></li> 
</ul> 

，并在弹出的

<li><a id="details" href="#">View details</a></li> 

二上click()事件存储电流ID添加id标签“查看Details`锚更容易访问后来到一个全局变量（姑且称之为它currentId）并以编程方式打开弹出窗口。

var currentId = 0; 
... 
$('#page').on('pageinit', function(){ 
    $('#list li a').click(function(e){ 
     e.preventDefault(); 
     currentId = $(this).attr("data-id"); 
     $("#popup-menu").popup("open", {transition:"slideup"}); 
    }); 
}); 

三在popupbeforeposition事件构建您的网址，并将其分配给相应的锚。

var baseURL = "person.php?id="; 
... 
$('#popup-menu').on('popupbeforeposition', function(){ 
    $("#details").attr("href", baseURL + currentId); 
}); 

最后在这里工作jsFiddle你。