jquery列表選擇變量

Question

我有這個jquery列表元素與我用來教自己編碼的示例應用程序一起使用。我有不同的價值觀被列入清單。問題在於我試圖找出用戶選擇的列表上的哪個項目，然後我可以返回到數據庫並將與該項目有關的所有信息拖出到屏幕上。

我試着做它迄今的方法是這樣的：

<script type="text/javascript"> 
    $(document).on('pagebeforeshow', '#index', function(){ 
     $("#list").empty(); 
     var url="http://localhost/test/login/json4.php"; 
     $.getJSON(url,function(json){ 
      //loop through deals 
      $.each(json.deals,function(i,dat){ 
       $("#list").append("<li><a id='"+dat.dealid+"'><h1>"+dat.name+"</h1><p>"+dat.dname+"</p></a></li>"); 
       $(document).on('click', '#'+dat.dealid, function(event){ 
        if(event.handled !== true) // This will prevent event triggering more then once 
        { 
         listObject.itemID = $(this).attr('id'); 
         $.mobile.changePage("#index2", { transition: "slide"}); 
         event.handled = true; 
        } 
       });    
      }); 
      $("#list").listview('refresh'); 
     }); 
    }); 

    $(document).on('pagebeforeshow', '#index2', function(){  
    $('#index2 [data-role="content"]').html('You have selected Link' + listObject.itemID); 
    }); 

    var listObject = { 
     itemID : null 
    }  
</script> 

JSON數組被創建的所有列表中的項目，並在屏幕上正在呈現。然後，我設法做到的是，當用戶進行選擇時，它會進入一個新頁面（索引2），並在索引2中指出哪個數據庫字段ID與所選項目相關聯。

我一直在嘗試過去的幾天找到一種方法，我可以把這個ID號碼，並把它帶回到數據庫端，但我一直沒有運氣 - 它要麼打破我的原始列表時我添加新的代碼或只是沒有任何反應！

如果有人能幫助我，我會非常感激！這似乎是一個核心課程，大多數人在我的位置應該學習，所以如果有人想教這裏做什麼，這將是太棒了！

在此先感謝您的幫助！祝大家週末愉快！

Answer 1

你應該做的是這樣的：

$(document).on('pagebeforeshow', '#index', function(){ 
    $("#list").empty(); 
    var url="http://localhost/ce/json4.php"; 
    $.getJSON(url,function(json){ 
     //loop through deals     
     $.each(json.deals,function(i,dat){ 
      $("#list").append("<li><a id='"+dat.dealid+"' data-restaurantid=" + dat.restaurantid + " data-image=" + dat.image + "><h1>"+dat.name+"</h1><h6>"+dat.dname+"</h6><h5>"+dat.description+"</h5></a></li>"); 
      $(document).on('click', '#'+dat.dealid, function(event){ 
       if(event.handled !== true) // This will prevent event triggering more then once 
       { 
        dealObject.dealID = $(this).attr('id'); 
        dealObject.dealName = $(this).find('h6').html(); 
        dealObject.description = $(this).find('h5').html(); 

        $.mobile.changePage("offer.php", { transition: "slide"}); 
        event.handled = true; 
       } 
      });    
     }); 
     $("#list").listview('refresh'); 
    }); 
}); 

$(document).on('pagebeforeshow', '#index2', function(){  
    $('#index2 [data-role="content"]').find('input#desc').val(dealObject.description); 
    $('#index2 [data-role="content"]').find('input#name').val(dealObject.dealName); 
    $('#index2 [data-role="content"]').find('input#did').val(dealObject.dealID); 


}); 

var dealObject = { 
    dealID : null, 
    dealName : null, 
    description: null 
} 

Answer 2

您可以使用localStorage臨時存儲itemID，然後將其返回到下一頁。

localStorage['itemID'] = $(this).attr('id'); 

然後retrive它在＃索引2：

itemID = localStorage['itemID'];