2016-06-13 9 views
0

Привет У меня есть функция Javascript initMap(); Я хотел бы, чтобы эта функция загружалась через тело onload = "initMap();" После загрузки страницы я могу перейти в отладчик IE и написать initMap(); в консоли, и он все еще говорит, что эта функция не определена. Я знаю, что есть проблема с жизненным циклом страницы, но я не уверен, что проблема в точности. Любая помощь будет принята с благодарностью.Функция не вызывается после загрузки тела

function initMap() { 
    var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 11, 
    center: { 
     lat: 33.923928, 
     lng: -118.245153 
    } 
    }); 
    var trafficLayer = new google.maps.TrafficLayer(); 
    trafficLayer.setMap(map); 
} 
var fancy = document.createElement('script'); 
fancy.src = 'scripts/jquery-1.12.1.min.js'; 
fancy.type = 'text/javascript'; 
fancy.language = "javascript"; 
document.head.appendChild(fancy); 
fancy.onload = function() { 
    $.noConflict(); 
    initMap() 
    SetSlideIntervals() 
    jQuery.ajax({ 
    dataType: "json", 
    url: "http://dev.virtualearth.net/REST/v1/Traffic/Incidents/33.799323,-118.402795,34.045909,-118.086747?key=Aq1xeHo7y0F9fT24Yk4DlC5tEFmf_RiGLc4wj734BXZpevMgGM4uZNvk4sc3PEpD", 
    data: "", 
    success: function(WeatherObj) { 
    } 
    }); 
} 
+0

Где и как вы ЗАГРУЗКА вашего скрипта в ваш HTML? –

ответ

1

Поскольку вы используете JQuery, почему бы просто не использовать DOM-обработчик готов JQuery?

 <!DOCTYPE html> 
    <html> 
     <head> 
      <title>Test stuff</title> 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> 
     </head> 
     <body> 
      <script type="text/javascript"> 
       $(document).ready(function() { 
         console.log("ready!"); 
         function initMap() { 
          // your code here 
         } 

         initMap(); 
       }); 
      </script> 
     </body> 
    </html> 

Вы можете увидеть полное JQuery документации для этой функции: https://learn.jquery.com/using-jquery-core/document-ready/

-1
window.onload = function(){ 
function initMap() { 
       var map = new google.maps.Map(document.getElementById('map'), { 
        zoom: 11, 
        center: { lat: 33.923928, lng: -118.245153 } 
       }); 

       var trafficLayer = new google.maps.TrafficLayer(); 
       trafficLayer.setMap(map); 
      } 
      var fancy = document.createElement('script'); 
      fancy.src = 'scripts/jquery-1.12.1.min.js'; 
      fancy.type = 'text/javascript'; 
      fancy.language = "javascript"; 
      document.head.appendChild(fancy); 
      fancy.onload = function() { 
       $.noConflict(); 
       initMap() 
       SetSlideIntervals() 


       jQuery.ajax({ 
        dataType: "json", 
        url: "http://dev.virtualearth.net/REST/v1/Traffic/Incidents/33.799323,-118.402795,34.045909,-118.086747?key=Aq1xeHo7y0F9fT24Yk4DlC5tEFmf_RiGLc4wj734BXZpevMgGM4uZNvk4sc3PEpD", 
        data: "", 
        success: function (WeatherObj) { 

        } 

       }); 

      } 

    initMap();  
} 

Поместите все в window.onload()

После Everthing загружен, вы должны позвонить в вашу функцию.

+0

Nope. Это означает, что функция initMap будет доступна только внутри функции 'window.onload'. Кроме того, они уже добавляют слушателя, используя 'body onload =" initMap() "'. –

1

Используйте этот фрагмент кода:

window.onload = function() { 
    //all your code goes here. 
} 

или использовать html5 отложить право это:

<script src="code.js" defer></script> 
+0

Я пробовал поместить все в событие window.onload, но, к сожалению, initMap никогда не вызывается. Если я добрался до отладчика в IE, я получаю сообщение об ошибке. InitMap() не определен при вводе этого в консоль вручную. Я заметил, что когда я добавляю эту страницу в параметры просмотра совместимости, она работает правильно. –

+0

Im unsure, что говорит дефер, вы говорите, что вместо создания переменной javascript, которая является моей jQuery, я должен просто набрать defer в источнике скрипта? –