$(document).ready(function () { var jsonResult; $.get( 'json.php', displayData, //收到服务器响应时, Jquery解析它并将一个对象传给此回调方法 'json' ); // $.getJSON("json.php",displayData); function displayData(data) { jsonResult = data; var str = '<option value="">select a date</option>'; for(var i=0; i<data.length;i++) { str+= '<option value="' + data[i].travelDate + '">' + data[i].travelDate + '</option>'; } $('#travelDates').html(str); $('#travelDates').change(function() { if($(this).val() != '') { displayDetails($(this).val()); } }); } function displayDetails(selectedDate) { for(var i=0; i<jsonResult.length;i++) { var aResult = jsonResult[i]; if(aResult.travelDate == selectedDate) { $('#origin').html('<strong>Origin : </strong>'+ aResult.origin); $('#destination').html('<strong>Destination : </strong>'+ aResult.destination); var travellers = aResult.passengers; var strTraveller = '<ul>'; for(var j=0; j<travellers.length;j++) { strTraveller+= '<li>'; strTraveller+= travellers[j].name; strTraveller+= '</li>'; } strTraveller+= '</ul>'; $('#travellers').html('<strong>Travellers : <br/></strong>'+ strTraveller); break; } } } });