地圖沒有加載通過ajax請求收到的HTML代碼

-2

我正在建立我自己的個人網頁（和我的第一個網頁），我有一些麻煩試圖顯示谷歌地圖。地圖沒有加載通過ajax請求收到的HTML代碼

首先，我會試着解釋我的情況。我的網頁有四個鏈接，用於加載div中每個部分的HTML代碼。由於我不想在每次單擊鏈接時刷新我的網頁，因此通過AJAX請求接收到該HTML代碼。當點擊一個名爲'contact me'的部分時，我會調用初始化方法，以在通過AJAX收到的新HTML代碼中創建的div中加載地圖。當然我會在接收到HTML代碼後調用初始化。

一切似乎工作正常，但它只有當我第一次點擊鏈接。當我這樣做時，我可以看到地圖;但當我去另一個部分，然後再次點擊'聯繫我'我看到的div但地圖已經消失：

http://s8.postimg.org/9rllxtxed/map_error.jpg //我沒有足夠的聲望尚未發佈圖像。

這是初始化功能：

function initialize() { 
    var target_div = document.getElementById("map"); //This is the ID of the div created on the HTML code recieved through AJAX. 
    var mapOptions = { 
     center: new google.maps.LatLng(65.6516152,-34.7739923), 
     zoom: 12, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(target_div,mapOptions); //*map* is a global variable (one of my many tries to resolve it) 
}

這是調用AJAX請求和初始化顯示在一個div的內容稱爲reciever_div功能：

function open_section(clicked_link) { 
    if (actual_link != null){ 
     actual_link = clicked_link; 
     reciever_div.fadeOut(750,function(){ 
      reciever_div.html(''); 
      $.ajax({ 
       url: 'textos/'+clicked_link+'.txt', 
       success: function (recieved_file) { 
        reciever_div.html(recieved_file); 
        if (clicked_link == 'contactme') { 
         initialize(); 
        } 
        reciever_div.fadeIn(750); 
       } 
      }); 
     }); 
    } 
    else{ 
    actual_link = clicked_link; 
    $.ajax({ 
     url: 'textos/'+ clicked_link + '.txt', 
     success: function(recieved_file){ 
      reciever_div.html(recieved_file); 
      if (clicked_link == 'contactme') { 
       console.log(clicked_link); 
       initialize(); 
        } 
      reciever_div.fadeIn(1500); 
     } 
    }) 
    } 
}

你知道爲什麼會發生這種情況，或者更好的實現方式嗎？我是一個noob，並且我不知道我是否問太多ajax請求，CSS或什麼。

非常感謝！

來源

2015-08-26 Ornitier

在javascript控制檯中是否有任何錯誤（在Chrome中是否有錯誤？請參閱網絡中的錯誤代碼） – Hackerman

在控制檯中沒有錯誤，並且我不熟悉網絡窗口在鉻上，但我沒有看到任何形式的錯誤或警告。 – Ornitier

這是一個活的網站...你可以給我的網址（大豆de智利btw） – Hackerman

好吧，我做我的研究和灰色的地圖可能是由一些奇怪的CSS或執行流引起的行爲。我意識到，如果我打開Chrome的控制檯，地圖再次加載，並搜索信息我發現this post。我改變了初始化方法，在2秒鐘的setTimeout之後執行，它工作正常。我仍然沒有得到爲什麼這是第一次不需要我點擊鏈接，但它是爲以下的，但它確實。

謝謝！

來源

2015-08-27 08:24:56 Ornitier

我認爲你的第一個問題涉及到灰色谷歌地圖圖像我相關的事實，你不能創建更多的一次地圖。我在過去同樣的情況，我已經解決了檢查標誌之前創建的第一次地圖這樣

function setMapTarget() { 
    if (! flagMapTarget){ 
     flagMapTarget = true; 
     ...... 
     map = new google.maps.Map(document.getElementById('map_prg'), mapPrgOptions);

來源

2015-08-26 20:18:28 scaisEdge

我試過了，但當我這樣做，並重新加載部分的div不會出現：s18.postimg.org/5d1bqoukp/map_error2.jpg（好吧，說得好，它是從零，因爲當該部分關閉時，他的HTML代碼被刪除）。 – Ornitier

該部分可見或隱藏。如果已隱藏，請在創建後嘗試添加'google.maps.event.trigger（地圖，'調整大小'）;'。可能是「刷新」的問題，有時這解決了問題 – scaisEdge

它不起作用，我說div被刪除，而不僅僅是隱藏，因爲當我關閉'聯繫我'部分div變乾淨（receiver_div.html（' '）），所以當我再次單擊「聯繫我」部分時，它不會更改css可見性屬性，而是從零創建它。 – Ornitier

地圖沒有加載通過ajax請求收到的HTML代碼

回答

相關問題