OpenLayers + Ajax:错误或错误

我正在使用下面给出的代码来演示OpenLayers DIV容器中的映射。我不知道为什么，但我必须多次重新打开网页才能使地图可见。这不是互联网连接速度的问题。我真的必须单击几个jquery选项卡，最后在指定的选项卡中打开地图。实际上，不会生成任何错误消息。它发生在Chrome和Firefox中。我不知道这是一个错误还是我的错误。

请任何建议，非常感谢。

主页.php

    <script type="text/javascript">
      $(document).ready(function() {
            $("#tabs").tabs({
            ajaxOptions: {
                success: function( html ) {
                    $("#content").html(html);;
                }
            }
        });
      });           
    </script>
<div id="tabs">
    <ul>
        <li><a href="administration.php"><span>Administration</span></a></li>
        <li><a href="map.php"><span>Map</span></a></li>
    </ul>
</div>

地图.php

<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script>
    map = new OpenLayers.Map("basicMap");
    map.addLayer(new OpenLayers.Layer.OSM());       
    var points = new OpenLayers.Layer.Text( "Resource Locations",
                    { location: "dataLonLat.php",
                      projection: map.displayProjection
                   });
    map.addLayer(points);
    var geographic = new OpenLayers.Projection("EPSG:4326");
    var mercator = new OpenLayers.Projection("EPSG:900913");
    //Set start centrepoint and zoom 
    var lonLat = new OpenLayers.LonLat(2.07632,41.30408)
          .transform(
            geographic, // transform from WGS 1984
            mercator // to Spherical Mercator Projection
          );
    var zoom=16;
    map.setCenter (lonLat, zoom);  
  </script>
<div id="basicMap" style="width: 100%; height: 100%;">
</div>