body onload

时间:2016-06-13 17:03:28

标签: javascript onload lifecycle

您好我有一个Javascript函数initMap();我希望通过body 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) {
    }
  });
}

3 个答案:

答案 0 :(得分:1)

使用此代码段:

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

或使用html5 defer对此:

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

答案 1 :(得分: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/

答案 2 :(得分:-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()

加载后,你必须打电话给你的功能。