-1

我正在创建 Google Maps Mashup。在我尝试将 JQuery 选项卡传递到我的信息窗口之前,一切似乎都运行良好。基本上,我正在做的是:

  1. 创建地图
  2. 复选框的 Onclick 事件
  3. 创建标记
  4. 创建信息窗口
  5. 调用自定义函数为信息窗口生成 HTML(在这个自定义函数中,我给 HTML 元素一个唯一的名称)
  6. 然后我尝试调用 JQuery 函数来启动选项卡

这就是问题出现的地方。我收到 javascript 错误“无法读取未定义的属性 _ e3 ”。我确实尝试在创建信息窗口后调用自定义函数,但这没有帮助(尽管这是出现 JS 问题的地方)

我的代码如下:

var map;
        var mouseInfowindow;
        var infowindow;
        var bounds;
        var infoWindow = new google.maps.InfoWindow;
        var markers = [];

        function initialize() {
            var myOptions = {
                center: new google.maps.LatLng(-33.924868, 18.424055),
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                streetViewControl: true,
                zoomControl: true,
                panControl: true,
                mapTypeControl: true,
                zoom: 12,
                zoomControlOptions: { 'style': google.maps.ZoomControlStyle.LARGE, 'position': google.maps.ControlPosition.RIGHT_BOTTOM },
                panControlOptions: { 'style': google.maps.ZoomControlStyle.LARGE, 'position': google.maps.ControlPosition.RIGHT_BOTTOM },
                mapTypeControlOptions: { 'style': google.maps.MapTypeControlStyle.DROPDOWN_MENU, 'position': google.maps.ControlPosition.RIGHT_BOTTOM }
            };

            map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

            devcs = [];

            for (var i = 0; i < unitsArr.length; i++) {
                var unit = unitsArr[i];
                var marker = createMarker(unit[0], unit[1], unit[2], unit[3], unit[4], unit[5]);

                devcs[i] = marker;
                mymarker = marker;

                myLat = unit[2];
                myLng = unit[3];
            }

            //ShowClock();
        }

        function createMarker(a, b, c, d, e, f, g, h , i, j) 
        {

            // Hide the Marker and InfoWindow if the checkbox was unchecked
            if (j.checked == false)
            {
               hideMarker(a);
            } 
            else
            {
                // If the marker was created previously, simply show it (i.e. do not recreate it)
                if (show(a) == '0')
                {
                    // Create new marker that has not already been added to the page
                    var location = new google.maps.LatLng(c, d);
                    var marker = new google.maps.Marker({
                        position: location,
                        icon: e,
                        animation: google.maps.Animation.DROP,
                        map: map,
                        id: a
                        });

                    marker.setTitle(b);
                    map.panTo(location);
                    markers.push(marker);

                    google.maps.event.addListener(marker, 'click', function() {
                        if(infowindow) {
                            infowindow.close();
                        }   

                        var contentString = buildInfoWindowContent(a, b, c, d, e, f);
                        infoWindow.setContent(htmlEscape(contentString));
                        infoWindow.open(map,marker);

                        google.maps.event.addListener(infowindow, 'domready', function () {
                            $("#tab-panel-1234").tabs();
                        });

                    });
                }
             }
        }


        function buildInfoWindowContent(a, b, c, d, e, f)
        {

            var returnString = '<div class="infobox-wrapper">' + 
                               '     <div class="container_12" id="infobox" style="height:240px;overflow-y:auto;">' + 
                               '         <div class="grid_12">' + 
                               '             <div class="block-border" id="tab-panel-1234" style="width:610px;">' + 
                               '                 <div class="block-header">' + 
                               '                     <h1 id="MainTabTitle">' + b + '</h1>' + 
                               '                     <ul class="tabs">' + 
                               '                         <li><a href="#tab-1" id="TabOneHeader">Current</a></li>' + 
                               '                         <li><a href="#tab-2" id="TabTwoHeader">Trails</a></li>' + 
                               '                         <li><a href="#tab-3" id="TabThreeHeader">Download</a></li>' +
                               '                     </ul>' +
                               '                 </div>' +
                               '                 <div class="block-content tab-container" style="padding-top:10px; padding-bottom:10px;">' + 
                               '                     <div id="tab-1" class="tab-content">' + 
                                                        f + 
                               '                     </div>' + 
                               '                     <div id="tab-2" class="tab-content">' + 
                               '                        <table style="width:100%;" cellpadding="4" cellspacing="0">' + 
                               '                          <tr>' + 
                               '                              <td></td>' + 
                               '                              <td></td>' + 
                               '                          </tr>' + 
                               '                          <tr>' + 
                               '                              <td></td>' + 
                               '                              <td></td>' + 
                               '                          </tr>' + 
                               '                        </table>' + 
                               '                     </div>' + 
                               '                     <div id="tab-3" class="tab-content">' + 
                               '                         <p>' + 
                               '                         </p>' + 
                               '                     </div>' + 
                               '                 </div>' + 
                               '             </div>' + 
                               '         </div>' + 
                               '     </div>' + 
                               ' </div> ' ;

                return returnString;

        }

任何帮助将不胜感激!!

4

1 回答 1

0

有一个错字,标记的w必须是大写的:

google.maps.event.addListener(infowindow, 'domready',....
//--------------------------------^
于 2013-01-23T17:32:03.613 回答