Jquery mobile Openlayers磁贴未加载到PhoneGap应用程序-jQuery移动冲突？_Jquery Mobile_Cordova_Openlayers

Jquery mobile Openlayers磁贴未加载到PhoneGap应用程序-jQuery移动冲突？

jquery-mobile cordova openlayers

Jquery mobile Openlayers磁贴未加载到PhoneGap应用程序-jQuery移动冲突？,jquery-mobile,cordova,openlayers,Jquery Mobile,Cordova,Openlayers,作为我的第一个PhoneGap应用程序的一部分，我需要最终使用我自己的本地自定义瓷砖加载OpenLayers地图，但目前，我只是使用在线瓷砖进行测试，修改标准OpenLayers示例但是，当我尝试在iOS模拟器中初始化地图时，不希望使用OpenStreetMap或其他方法加载这些瓷砖。地图的初始化可以设置控件和版权声明，但我一直使用蓝色问号框，而不是活动瓷砖。在浏览器中独立测试地图加载代码，如果我删除jQuery Mobile引用，它似乎可以正常工作，但如果我在Xcode中调整文件，它似乎不起

作为我的第一个PhoneGap应用程序的一部分，我需要最终使用我自己的本地自定义瓷砖加载OpenLayers地图，但目前，我只是使用在线瓷砖进行测试，修改标准OpenLayers示例

但是，当我尝试在iOS模拟器中初始化地图时，不希望使用OpenStreetMap或其他方法加载这些瓷砖。地图的初始化可以设置控件和版权声明，但我一直使用蓝色问号框，而不是活动瓷砖。在浏览器中独立测试地图加载代码，如果我删除jQuery Mobile引用，它似乎可以正常工作，但如果我在Xcode中调整文件，它似乎不起作用，此外，它还破坏了我想要的外观和行为。这是一场已知的冲突吗？有人知道解决冲突的方法吗

提前谢谢

贾尔斯

对不起，忘了我说过！刚刚发现我需要在Cordova.plist中将映射服务器域的引用添加到ExternalHosts。现在图像似乎加载正常。

抱歉-忘了我说话了！刚刚发现我需要在Cordova.plist中将映射服务器域的引用添加到ExternalHosts。现在图像似乎加载正常。希望这对其他遇到同样问题的人来说是有用的，无论如何。。。

<!DOCTYPE html> 
<html> 
<head> 
<title>My Page</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="jquery.mobilecus-1.1.0.min.css"/>
    <script src="js/jquery-1.7.2.js"></script>
    <script src="js/jquery.mobile-1.1.0.min.js"></script>
    <script src="js/sessionstorage.1.4.js"></script>
    <script src="js/OpenLayers.js"></script>

<script type="text/javascript" charset="utf-8">

    $(function() { //ready
    // JQuery stuff trimmed out
    }); //end ready

    var map
    function init() {
       map = new OpenLayers.Map("mapview");
       map.addLayer(new OpenLayers.Layer.OSM());
       var lonLat = new OpenLayers.LonLat( 0.0 ,51.0).transform(
            new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
            map.getProjectionObject() // to Spherical Mercator Projection);
       var zoom=10;
       map.setCenter (lonLat, zoom);
       }
</script>
</head>

<body onload="init();"> 

<div data-role="page" id="page1" class="page">
     //html for first page (no map)
</div><!-- /page -->

<div data-role="page" id="page2" class="page">
    <div data-role="header" data-id="fixedheader" data-position="fixed" >   
    <h1>Fixed header</h1>
        </div><!-- /header -->

    <div data-role="content">
            <div id="leftbar">
            <img src="images/leftbar.png">
        </div><!-- /leftbar -->
        <div id="mapview">
            //map appears here
        </div><!-- /mapview -->
        </div><!-- /content -->

    <div data-role="footer"data-id="fixedfooter" data-position="fixed">
        <a id="ForwardButton">Forward</a><a id = "BackButton" href="#page2">Back</a>
    </div><!--/footer -->

</div><!-- /page -->

</body>
</html>