jQuery中模拟物流查询,跨域访问

来源:互联网 发布:程序员面试笔试宝典 编辑:程序博客网 时间:2024/05/02 02:30

本实例实现的jQuery中的跨域访问,查询物流信息。仅供新手参考,如有不当之处,敬请指正

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>        <script src="js/jquery-1.8.3.js"></script>        <script type="text/javascript">            $(document).ready(function(){                var name=[申通="shentong",EMS="ems",顺丰="shunfeng",                圆通="yuantong",中通="zhongtong",韵达="yunda",                天天="tiantian",汇通="huitongkuaidi",全峰="quanfengkuaidi",                德邦="debangwuliu",宅急送="zhaijisong"];                for(var i=0;i<name.length;i++){                    var x=$("<option>");                    x.text(name[i]);                    $("#txtName").append(x);                }                $("#btn").click(function(){                    var url="http://www.kuaidi100.com/query";                    //将参数拼接成一个json对象                    var param={"type":$("#txtName").val(),                                "postid":$("#txtId").val()};                    //调用getJson方法访问快递查询网站                    $.getJSON(url,param,function(e){                        for(var i=0;i<e.data.length;i++){                            var li=$("<li>");                            var time=e.data[i].time;                            var ftime=e.data[i].ftime;                            var context=e.data[i].context;                            var loc=e.data[i].location;                            li.html("出发时间:"+time+"<br>"+"到达时间:"+ftime+"<br />"+                                    "内容:"+context+"<br />"+"到达时间:"+loc);                            $("ul").append(li);                        }                    });                });            });        </script>    </head>    <body>        快递公司名称:<select id="txtName"></select>        输入快递编号:<input type="text" id="txtId"/>        <input type="button"id="btn" value="查询" />        <ul></ul>    </body></html>
原创粉丝点击