Question

我的想法很简单：

从一个API（http://ip-api.com/json）获取地理位置并显示
基于此地理位置查找（使用另一个api http://api.geonames.org/）半径70km内最近的山脉
并显示名称

我有第三点的问题 - 我得到一个链接（显示为警告），它引导我以JSON格式的对象列表（？）但是......我想要一个警报或html显示，其中包含完整的山脉列表名称。怎么做到这一点？

    <!DOCTYPE html>
<html lang="en">    
<head>    
    <meta charset="utf-8">  
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>        
    <link rel="stylesheet" href="api_try.css">    
    <script src="api_try.js"></script> 
</head>    
<body>
    <button type="submit" class="form-btn" value="sbutton" onsubmit="">Try!</button>

    <div id="geo_view">..</div>
    <div id="mountains">..</div>

</body>

</html>

JS：

$(document).ready(function () {
        $(".form-btn").on("click", function () {    
            var lat;
            var lon;
            $.get("http://ip-api.com/json", function (data) {

                lat = data.lat;
                lon = data.lon;

                $('#geo_view').html(data.city);
                alert(data.city);
            });

            var url1 = "http://api.geonames.org/findNearbyJSON?lat=";
            var url2 = "&lng=";
            var url3 = "&featureCode=MTS&radius=70&username=zebru";

            var url = url1 + lat + url2 + lon + url3;

            alert(url);
            alert("2");

                $.get(url,function(data){
                alert("3");
                    var mt = $('#mountains").html(data.toponymName);
                   alert(mt);       
            });
        });
});

从API获取数据并在页面上显示

0 个答案: