requesting network ajax api

forward from:

https://www.cnblogs.com/kudsu/p/9620726.html

 

Long-winded, directly on the code:

1, in the browser enter the URL: http: //api.asilu.com/weather/ callback = getname & city = Shenzhen?

You will see the following results: He returns json data

/** api.asilu.com **/getname({"city":"深圳","pm25":"28","weather":[{"date":"周一 09月10日","icon1":"day\/duoyun","icon2":"night\/duoyun","weather":"多云","wind":"无持续风向微风","temp":"31 ~ 25℃"},{"date":"周二","icon1":"day\/duoyun","icon2":"night\/duoyun","weather":"多云","wind":"无持续风向微风","temp":"31 ~ 27℃"},{"date":"周三","icon1":"day\/leizhenyu","icon2":"night\/leizhenyu","weather":"雷阵雨","wind":"东风4-5级","temp":"31 ~ 26℃"},{"date":"周四","icon1":"day\/zhenyu","icon2":"night\/zhenyu","weather":"阵雨","wind":"东风3-4级","temp":"30 ~ 26℃"}],"date":"2018-09-10","id":"101280601","t":1536508800});

After finishing like this:

Copy the code
/** api.asilu.com **/
getname({
    "city": "深圳",
    "pm25": "28",
    "weather": [{
        "date": "周一 09月10日",
        "icon1": "day\/duoyun",
        "icon2": "night\/duoyun",
        "weather": "多云",
        "wind": "无持续风向微风",
        "temp": "31 ~ 25℃"
    }, {
        "date": "周二",
        "icon1": "day\/duoyun",
        "icon2": "night\/duoyun",
        "weather": "多云",
        "wind": "No sustained wind breeze ", 
        " Wind ": "Dongfeng 4-5"
        " Weather ":" thunderstorm ",
        " icon1 ":" Day \ / leizhenyu ",
        " DATE ":" Wednesday ",
    }, {
        " TEMP ":" 31 is ~ 27 deg.] C "
        " the icon2 ":" night \ / leizhenyu ",
        "temp": "31 ~ 26℃"
    }, {
        "date": "周四",
        "icon1": "day\/zhenyu",
        "icon2": "night\/zhenyu",
        "weather": "阵雨",
        "wind": "东风3-4级",
        "temp": "30 ~ 26℃"
    }],
    "date": "2018-09-10",
    "id": "101280601",
    "t": 1536508800
});
Copy the code

2, how to obtain the above json data? It is simple:

Copy the code
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>ajax</title>
</head>
<body>
    <h1>天气查询</h1>
    <input type="text" placeholder="请输出你的地址" id="tel"/>
    <button id="ajax">确定</button>
    <p><span id="reslut"></span></p>
    <script type="text/javascript" src="jquery-3.3.1/jquery-3.3.1.js"></script>
    <script type="text/javascript">
    $(function(){
        $('#ajax').on('click',function(){
            var $telValue=$('#tel ') Val ();. 
            }
                return;
                Alert (' not empty ');!
            IF ($ telValue == "") {
            $ .ajax ({
                type: 'the GET', 
                dataType: 'JSONP', 
                URL: 'http://api.asilu.com/weather/?callback=getname&city='+$telValue, 
                Success: function (Data) { 
                    var = Data reslutData; 
                    Console .log (reslutData);     
                    . $ ( '# reslut') text ( "your query is:" + reslutData.city + "," + " weather tomorrow is:" + reslutData.weather [0] .weather); 
                }              
            }) 
        })        
    }) 
    </ Script> 
</ body> 
</ HTML>
Copy the code

Guess you like

Origin www.cnblogs.com/gudaozi/p/10988148.html