谷歌地圖顯示的錯誤，但地圖，顯示正確

Question

我知道很多人面臨這種​​類型的錯誤，因爲很多問題&回答有關這種類型的錯誤

下面的是我的動態頁腳

<script src="https://maps.googleapis.com/maps/api/js?key=key&callback=initMap" async defer></script> 
<script async src="assets/js/custom.js"></script> 

custom.js看起來像

jQuery(document).ready(function($) { 
    // Google Map 
    function initMap(){ 
     var location = new google.maps.LatLng(40.712784, -74.005941); 
     var myOptions = { 
      zoom: 6, 
      center: location, 
      scrollwheel:false 
     }; 
     var map = new google.maps.Map(document.getElementById("map"), 
     myOptions); 
     var marker = new google.maps.Marker({ 
      position: location, 
      map: map 
     }); 
     // alert("Google Working"); 
    }; 
    google.maps.event.addDomListener(window, "load", initMap); 
}); 

地圖格只爲contact-us.html頁

<div id="map"></div> 

但地圖顯示&也呈現出類似下面

InvalidValueError: initMap is not a function 

&沒有contactus.html所有頁面顯示在控制檯上提示以下錯誤：錯誤

TypeError: a is null 
...ndChild(c)};_.ug=function(a){for(var b;b=a.firstChild;)_.tg(b),a.removeChild(b)} 

我2天&去年搜索申請這個，但沒有任何有用的答案。

我需要銷燬錯誤。

我的代碼有什麼問題。

感謝

基於編輯答案，工作現在

function initMap(){ 
var divId = document.getElementById("map"); 
if (!divId) { 
    return; 
} 

var location = {lat: 40.712784, lng: -74.005941}; 
var map = new google.maps.Map(divId,{ 
    zoom: 6, 
    center: location, 
    scrollwheel:false 
}); 
var marker = new google.maps.Marker({ 
    position: location, 
    map: map 
}); 
} 

加載JS

<script src="assets/js/custom.js"></script> 
<script src="https://maps.googleapis.com/maps/api/js?key=key&callback=initMap" async defer></script> 

Answer 1

你的功能initMap()在匿名函數作用域這樣的GoogleMaps無法看到此功能。 您應該聲明在全球範圍內的功能，而不jQuery(document).ready(function($) { ...

function initMap(){ 
    var div = document.getElementById("map"); 
    if (!div) { 
     return; 
    } 
    var location = new google.maps.LatLng(40.712784, -74.005941); 
    var myOptions = { 
     zoom: 6, 
     center: location, 
     scrollwheel:false 
    }; 
    var map = new google.maps.Map(div, 
    myOptions); 
    var marker = new google.maps.Marker({ 
     position: location, 
     map: map 
    }); 
    // alert("Google Working"); 
}; 
window.onload = function() { 
    if (google) { 
     google.maps.event.addDomListener(window, "load", initMap); 
    } 
} 

更多範圍：https://toddmotto.com/everything-you-wanted-to-know-about-javascript-scope/#what-is-local-scope

負載庫：

<script src="assets/js/custom.js"></script> 
<script src="https://maps.googleapis.com/maps/api/js?key=key&callback=initMap" async defer></script> 

Answer 2

自定義的js文件鏈接需要去上，然後谷歌像下面API鏈接

<script src="assets/js/custom.js"></script> 
    <script src="https://maps.googleapis.com/maps/api/js?key=key&callback=initMap" async defer></script> 

編輯自定義的js文件中看到下面代碼工作

function initMap(){ 
    var location = {lat: 40.712784, lng: -74.005941}; 
    var map = new google.maps.Map(document.getElementById("map"),{ 
    zoom: 6, 
    center: location, 
    scrollwheel:false 
    }); 
    var marker = new google.maps.Marker({ 
    position: location, 
    map: map 
    }); 
} 

我希望能幫助你

感謝