jQuery-ui-map not displayed when navigating from other html file
这是我关于stackoverflow的第一个问题,所以要温柔:)
我正在使用 jQuery、jQuery mobile 和 jQuery-ui-map 插件制作一个移动 Web 应用程序。当我刷新应该显示它的文件(map.html)时,地图工作得很好,但是从 index.html 导航时它根本不会出现。控制台显示没有错误。我试过做一个 $(\\’#map_canvas\\’).gmap(\\’refresh\\’);在 pageinit 上,但这也不起作用。当我直接刷新文件时,这也会打乱平移…
我也尝试过不使用页脚菜单中的预取和使用 data-rel=”external”(这会弄乱 jquery 移动样式)
这里是 index.html 的页脚导航:
1
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
<ul>
|
这是地图的代码:
1
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 |
$(‘#map_canvas’).gmap({‘maxZoom’:17,’center’: new google.maps.LatLng(center_latitude,center_longitude),’callback’: function() {
var self = this; // Get the current position self.getCurrentPosition(function(position, status) { // If we got the current position, add the marker if ( status === ‘OK’ ) { // Stor current position in a var var clientPosition = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); // Add the current position marker self.addMarker({ id:’mark_pos’,’position’: clientPosition, ‘bounds’: true}) .click(function() { $(‘#map_canvas’).gmap(‘openInfoWindow’, { ‘content’: Lang.mapHtml.txt_marker_my_position_content }, this); }); // Paint a blue cirecle where your position is self.addShape(‘Circle’, { ‘strokeWeight’: 0, ‘fillColor’:”#008595″, ‘fillOpacity’: 0.25, ‘center’: clientPosition, ‘radius’: 15, ‘clickable’: false }); // Bind direction marker button and show it $(“#divBtnDirection”).show(); var that = this; $(“#btn_directions”).click(function() { that.displayDirections({ ‘origin’: clientPosition, ‘destination’:center_latitude+’,’+center_longitude , ‘travelMode’: google.maps.DirectionsTravelMode.DRIVING }, { ‘panel’: document.getElementById(‘directions’) }, function(result, status) { if ( status === ‘OK’ ) { $(‘#map_canvas’).gmap(‘clear’, ‘markers’); $(“#divBtnDirection”).hide(); $(“#directions”).fadeIn(1000); } }); self.addMarker( { id:’mark_center’, ‘position’: center_latitude+’,’+center_longitude, ‘bounds’: true }).click(function() { }}); |
该网站目前正在此处显示(其为挪威语)
谢谢!
首先欢迎使用 Stackoverflow..:)
确保在导航时调用您的函数。尝试在函数中放置一个消息框并检查。
还可以尝试在
的 head 部分调用 map 函数
1
2 3 |
$(function(){
//your function call }); |
希望这有帮助..
- 是的,这就是现场!它在 $(function(){..} 内部被调用,它不会在页脚菜单的页面更改时触发。但奇怪的是 $(“#page_map”).live(“pageshow”, function() { \\t\\tconsole.log(“INIT!”); }); 也不会在导航时触发。有什么建议吗?
- 尝试在您的身体标签关闭之前调用它。我的意思是在</body>之前。
- 似乎根本没有运行任何javascript。警报(“这里”);在头部或在 </body> 之前
- 啊,我们走吧。对于有类似问题的任何人:jquerymobile.com/test/docs/pages/page-scripting.html
- 您到该网站的链接无效。您可以仔细检查错误控制台中是否生成了 NO ERROR 吗?
- 链接可能无法正常工作,因为我正在更新它:-) jQuery Mobile 在通过 ajax 时会从链接页面的标题中删除样式和脚本(在我的情况下是这样)。但是如果放在第一页的最后一个 end-div 之前,它将执行站点特定的样式和脚本。 <!– 这里 –>
来源:https://www.codenong.com/9128121/