Jquery Mobile使用单页模板传递和检索数据

Question

我使用来自json请求的数据创建了一个listview。listview会填充，我想单击listview项目并转到更商详的页。我需要在#page4上检索单击列表项目的value.id1。我正在使用单页jQuery移动模板。我知道下面的方法不正确，但希望它能让我对我要完成的任务有所了解。使用jQuery移动的单页模型将数据（value.id1）从列表传递到另一个页面的最佳方法是什么？

     $("#podList").click(function(){

        var listHtml ="<li>Select a date</li>"; 
        var driverid = $("#driverid").val();
        var url = "podHistory.php"
        $.post(url,{ driver: driverid } , function(response){
        var json = $.parseJSON(response);


        $.each(json, function(key, value){  

             listHtml += "<li><a href='#page4?=" + value.id1 + "'>" + value.date + "</a></li>";

            });//end each

    $("#history").html(listHtml); 
    $('ul').listview('refresh');

        });//end post podlist

        });//end pod list click 

   $("#page4").on("pagebeforeshow", function () { 

    var page = $(this);
    var query = page.data("url").split("?")[1];
    var id = query.split("=")[1];
    // console.log(id);
 });

Answer 1

您可以添加值。id1，并在单击时抓取它。

演示

http://jsfiddle.net/5hzxqmpf/

html

<ul data-role="listview" id="mylist">
 <li data-id="1">Row 1</li>
 <li data-id="2">Row 2</li>
 <li data-id="3">Row 3</li>
 <li data-id="4">Row 4</li>
</ul>

滑动分页

var rowid;

$(document).on("click", "#mylist >li", function() {
rowid = $(this).closest("li").attr("data-id");
alert(rowid);;    
})