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你。