Jquery Json

            $(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;
                        }
                    }
                }
            });
posted on 2014-04-24 22:59  思静  阅读(351)  评论(0编辑  收藏  举报