未捕获的类型错误：无法读取未定义的属性“地理代码”答案

【问题标题】：Uncaught TypeError: Cannot read property 'geocode' of undefined未捕获的类型错误：无法读取未定义的属性“地理代码”
【发布时间】：2015-11-15 05:17:22
【问题描述】：

我无法让我的地理编码在我的一个 jsp 页面中工作。它在另一个工作，但这个正在造成麻烦。

我有一个 base.jsp，它在我的所有 jsp 页面之间共享。其中有：

var geocoder;

$(document).ready(function initialize() {       
    map = new google.maps.Map(document.getElementById('map-canvas'), {
        center : { lat : 56.138, lng : 8.967 },
        zoom : 7,
        disableDoubleClickZoom : true
        });          

    geocoder = new google.maps.Geocoder();                              
});

function addressTolatlng(address){
    geocoder.geocode( { 'address': address}, function(results, status) {

          if (status == google.maps.GeocoderStatus.OK) {
            var latitude = results[0].geometry.location.lat();
            var longitude = results[0].geometry.location.lng();
            var myLatlng = new google.maps.LatLng(latitude, longitude);

            console.log(myLatlng);

          } 
    }); 
}

这是我的jsp页面，它给出了错误：

$( document ).ready(function() {
    console.log(input);
    var input = document.getElementById('addressField');         
    var autocomplete = new google.maps.places.Autocomplete(input, {
        types: ["geocode"]
    });   

    autocomplete.bindTo('bounds', map);                          
});

<input type="text" placeholder="address" name="address" id="addressField" class="form-control" aria-label="..." value="">

<script>
$("#addressField").keyup(function() {                                       
    var address = document.getElementById('addressField').value;    
    addressTolatlng(address);
});                                                                     
</script>

我得到 Uncaught TypeError: Cannot read property 'geocode' of undefined 运行时。但是我得到了另一个页面，它具有相同的设置，并且它工作得很好，所以对我来说这个页面的行为方式不同对我来说有点奇怪。

控制台也给出了这些：

(anonymous function)    @   eventHandler?action=createEvent:790
m.event.dispatch    @   jquery-1.11.3.min.js:4
r.handle    @   jquery-1.11.3.min.js:4

我有很多脚本导入，对我来说这是页面上的唯一区别。这会导致问题吗？

【问题讨论】：

你有匿名函数，并且地理编码是在它外面定义的，所以它不会在里面被识别。这意味着它将返回未定义。
我可以看到控制台也给出了匿名功能的提示。但这在另一个页面中有效，为什么在这里不起作用？
Danial 解释的内容与我所说的基本相同。您必须了解，如果要将变量传递给函数，则需要在该函数的参数中进行设置。例如：function your_function( $a, $b, $c ) { console.log($a); // < no longer undefined :) }

标签： javascript google-maps jsp

【解决方案1】：

在这行代码中

geocoder.geocode( { 'address': address}, function(results, status) {

geocoder 未定义（或为 null），并且无法访问其中的任何内容，因为它不知道 geocoder 是什么。

未定义的原因是地理编码器超出了 addressTolatlng 函数的范围。要解决此问题，您可以a）通过参数将地理编码器传递给您的函数b）在该函数中再次定义地理编码器或c）将该函数添加到您的initialize（）函数（但我不是100％）

希望有帮助！

【讨论】：

感谢您澄清这一点。我去了，它现在可以工作了:)