Question

表单设置为将用户输入收集到地址var中。使用jQuery序列化每个URL要求的地址。 jquery serialize 使用getJSON将请求发送到谷歌地理编码api。在for循环中使用for循环来运行结果。最后，访问JSON结果。

问题：为什么我得到undefined结果？

代码：

$(function() {
    var address = document.getElementById('address').value;
    address += " "+document.getElementById('street_add').value;
    address += " "+document.getElementById('city').value;
    address += " "+document.getElementById('state').value;
    address += " "+document.getElementById('postcode').value;   

    $('#clickme').click(function() {
        var strAddress = $( "address" ).serialize();
        // data is an object containing info also called a map key/values
        $.getJSON("http://maps.googleapis.com/maps/api/geocode/json?address=strAddress&sensor=false", function( data ) {
            for (var i = 0; i <= data.length; i++) {
                for (key in data.results[i]) {
                    var mystring = data.results[0].formatted_address;
                    var mylat = data.results[0].geometry.location.lat;
                    var mylng = data.results[0].geometry.location.lng;
                } 
            }

            $("<ul/>", {
                "class": "zombies",
                html: document.write(mystring,'<hr />', mylat, '<hr />', mylng),
            }).appendTo( "body" ); 
        });
    });
});

Answer 1

首先，您需要将address的值附加到url字符串。

其次，您将document.write的返回值分配给新html元素的ul属性。 document.write不会返回任何内容，因此您会看到undefined。

此外，您正在循环data.results但是每次迭代只检索第一项，因此for是多余的。试试这个。

$.getJSON("http://maps.googleapis.com/maps/api/geocode/json?address=" + strAddress + "&sensor=false", function( data ) {
    var mystring = data.results[0].formatted_address;
    var mylat = data.results[0].geometry.location.lat;
    var mylng = data.results[0].geometry.location.lng;

    $("<ul/>", {
        "class": "zombies",
        html: mystring + '<hr />' +  mylat + '<hr />' + mylng),
    }).appendTo("body"); 
});

为google api http请求使用动态变量

1 个答案: