1

ポップアップで動的に URL に問題があります。ここに私のコード：

<!-- 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 -->

基本的に、ポップアップのリンクをクリックすると、呼び出し先の URLがあるページに移動します。

したがって、リスト 1aをクリックするとポップアップが表示され、 [詳細を表示] をクリックすると、ページが URL person.php?id=1に誘導されます。

どうやってやるの？

リストの数に応じてポップアップdivを複数回作成することもできますが、DOMオブジェクトの無駄だと思います（エレガントな解決策が見つからない場合の最後の手段）

ありがとう

4

1 に答える 1

2

実際にはポップアップに人のIDのみを渡す必要があるため、次の方法で目標を達成できます。

まず、リストビュー マークアップを単純化し、リストビュー アイテムのアンカーのidin属性を保存します。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>

id後で簡単にアクセスできるように、ポップアップの「View Details」アンカーにタグを追加します

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

2 番目のclick()イベントでは、現在の ID をグローバルに使用可能な変数に保存し (それを と呼びましょう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"} );
    });
});

3 番目にpopupbeforeposition、URL を構築し、適切なアンカーに割り当てます。

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

そして最後に、 jsFiddleが機能しています。

于 2013-03-01T10:34:12.640 に答える