Question

我的用户最近告诉我，默认页面加载速度比之前慢得多。我认为这是因为地图会在页面加载时立即加载。有没有办法延迟它，直到点击这里点击按钮？

根据我从答案到目前为止收到的建议，我决定从外部URL调用地图。但是没有执行加载页面上的Javascript。锄头我能解决这个问题吗？

谢谢！

这就是我调用外部页面的方式。

$(function() {

    // if the function argument is given to overlay,
    // it is assumed to be the onBeforeLoad event listener
    $("a[rel]").overlay({

        mask: 'darkred',
        effect: 'apple',

        onBeforeLoad: function() {

            // grab wrapper element inside content
            var wrap = this.getOverlay().find(".contentWrap");

            // load the page specified in the trigger
            wrap.load(this.getTrigger().attr("href"));
        }

    });
});
<!-- external page is given in the href attribute (as it should be) -->
<a href="default.cs.asp?Process=ViewCheckinMap" rel="#overlay" style="text-decoration:none">
  <!-- remember that you can use any element inside the trigger -->
  <button type="button">Show external page in overlay</button>
</a>

这是未执行的内容。

<script>
      function initialize() {
        var data = <%=Data%>;
        var center = new google.maps.LatLng(48.404840395764175, 2.6845264434814453);

        var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 2,
          center: center,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        });

        var markers = [];
        for (var i = 0; i < data.users.length; i++) {
          var location = data.users[i];
          var latLng = new google.maps.LatLng(location.latitude,
              location.longitude);
          var marker = new google.maps.Marker({
            position: latLng
          });
          markers.push(marker);
        }
        var markerCluster = new MarkerClusterer(map, markers);
      }
      google.maps.event.addDomListener(window, 'click', initialize);
</script>

Answer 1

关于您更改的问题：

删除google.maps.event.addDomListener(window, 'click', initialize);

将wrap.load(this.getTrigger().attr("href"));更改为：

wrap.load(this.getTrigger().attr("href"), function(){initialize();});

这应该在加载外部javascript后立即初始化你的地图。

未经测试:(

Answer 2

这意味着您需要使用ajax加载外部页面。

要做到这一点，请创建一个新的html页面。并将其命名为map.html。在 map.html 页面中，只需输入您的Google地图代码。

表示您的默认页面<a href="map.htm" rel="#overlay">Click here to open the map</a>。

之后，您的地图将被加载。 contentWrap div使用ajax方法。

<!-- overlayed element -->
 <div class="apple_overlay" id="overlay">
  <!-- the external content is loaded inside this tag (map.html) -->
  <div class="contentWrap"></div>
 </div>

.contentWrap

的Css

/* container for external content. uses vertical scrollbar, if needed */
div.contentWrap {
height: 400px; // it is the same height of the #map div
overflow-y:auto;
}

在加载的页面中执行javascript

2 个答案: