JQuery:在onclick方法之后无法加载OpenLayers映射

时间:2013-04-08 18:24:36

标签: php jquery html jquery-mobile openlayers

我的JQM网站上有一个OpenLayers地图,无法正确加载。我确信这取决于onclick()方法,但我不太确定其他任何方法。我已经查看了JQuery站点上的.click()方法,但我认为这不会起作用,因为该方法必须如何工作。

onclick()方法位于列表中并加载一个JS函数,该函数更新另一页面上的html。该列表由一个PHP循环填充,该循环从数组中获取数据;更改的HTML取决于选择的项目。该功能还在同一页面上创建地图。

这是PHP循环:

<?php       
          for ($row = 0; $row < $arrlength; $row++)
          {
              echo "<li>";   
              echo "<a href='#room-info' onclick='updateRoom(\"".$rooms[$row]["Room"]."\", \"".$rooms[$row]["Building"]."\", \"".$rooms[$row]["Campus"]."\", \"".$rooms[$row]["X"]."\", \"".$rooms[$row]["Y"]."\");'>";
              echo $rooms[$row]["Room"];
              echo "</a>"; 
              echo "</li>";
          }
?>

这是JS函数:

function updateRoom(roomNumber, building, campus, xCoor, yCoor)
    {
        x=document.getElementById("roomInfo");  // Find the element
        x.innerHTML="<h1>Room</h1>" + roomNumber + "<br><h1>Building</h1>" + building + "<br><h1>Campus</h1>" + campus;    // Change the content

        var map, baseLayer;
        var options = {numZoomLevels: 7, isBaseLayer: true,};

        map = new OpenLayers.Map('map');            
        baseLayer = new OpenLayers.Layer.Image("College Lane","college-lane-large.png", 
        new OpenLayers.Bounds(-1000, -1000, 1000, 1000),
        new OpenLayers.Size(1500,1500), options);
        map.addLayer(baseLayer);

        var center = new OpenLayers.LonLat(xCoor,yCoor);
        map.setCenter(center ,0);  

        map.addControl(new OpenLayers.Control.LayerSwitcher());
        map.addControl(new OpenLayers.Control.MousePosition());

        var size = new OpenLayers.Size(21,25);
        var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
        var icon = new OpenLayers.Icon('http://www.openlayers.org/dev/img/marker.png',size,offset);
        var markers = new OpenLayers.Layer.Markers( "Marker" );
        map.addLayer(markers);
        markers.addMarker(new OpenLayers.Marker(center), icon);
    }

选择一个项目后,您将进入显示更新的HTML以及OpenLayers地图的页面。 html文本正确更新,但OpenLayers地图为空。

我会把代码放在这里但是有很多。我的网站位于:http://getontinternet.com/fyp/index.php

要进入麻烦的页面,您必须首先点击“查找房间”,搜索LC154,因为这是我设置的唯一项目。选择该房间后,它将显示该页面。

我一直试图解决这个问题已经好几天了,所以我会非常感激有人真正设法弄明白为什么它不起作用。)

1 个答案:

答案 0 :(得分:0)

您的结果页面给出了以下错误:TypeError:$ .event.handle未定义。 我想你应该看看:Getting back the event handler returns undefined