zoukankan      html  css  js  c++  java
  • 使用jQuery-AJAX–读取获得跨域JSONP数据的示例

    在项目开发中,如果在同一个域名下就不存在跨域情况,使用$.getJSON()即可实现。但是需要跨域请求其他域名下面的Json数据就需要JSONP的方式去请求,跨域写法和getJSON有差异。如下:

     
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>使用jQuery-AJAX--读取获得跨域JSONP数据</title>
        <script src="./jquery-1.7.2.js" type="text/javascript"></script>
        <style type="text/css">
            body,html{font-family: "Microsoft Yahei";}
            a{text-decoration: none;}
        </style>
    </head>
    <body>
    <h2><a href="javascript:void(0)" class="btnAJAX">点击AJAX获取数据JSONP跨域....</a></h2>
    <h2><a href="javascript:void(0)" class="btnAJAX">点击AJAX获取数据JSONP跨域....</a></h2>
    <h2><a href="javascript:void(0)" class="btnAJAX">点击AJAX获取数据JSONP跨域....</a></h2>
    <h2><a href="javascript:void(0)" class="btnAJAX">点击AJAX获取数据JSONP跨域....</a></h2>
    <script type="text/javascript">
    $(function() {
        $(".btnAJAX").click(function(){
            $.ajax({
                type : "get",
                async:false,
                url : "http://weather.123.duba.net/static/weather_info/101121301.html",
                dataType : "jsonp",
                jsonp: "callbackparam",             //服务端用于接收callback调用的function名的参数
                jsonpCallback:"weather_callback",   //callback的function名称
                success : function(json){
                //  console.log(json);              //浏览器调试的时候用
                    alert(json.weatherinfo.city);
                    alert(json.weatherinfo.week);
                    alert(json.update_time);
                },
                error:function(){
                    alert('fail');
                }
            });
        });
     
    });
    </script>
     
    </body>
    </html>
     
     
  • 相关阅读:
    luogu P1455 搭配购买
    浅谈筛素数
    luogu P1205 方块转换
    luogu P2241 统计方形
    luogu P1866 编号
    luogu P1042 乒乓球
    4.7清明考试(完蛋)
    LINUX 启动图形界面和查看运行级别
    密钥登录LINUX步骤
    服务命令只支持基本的LSB操作(启动、停止、重新启动、尝试重启、重新加载、强制重新加载、状态)。对于其他操作,请尝试使用systemctl。
  • 原文地址:https://www.cnblogs.com/flyerca/p/6113692.html
Copyright © 2011-2022 走看看