在jquery boxy中添加百度地图坐标拾取注意流程
更新时间：2014年04月03日 16:30:04 作者：
这篇文章主要介绍了在jquery boxy中添加百度地图坐标拾取注意流程,需要的朋友可以参考下
作为开发的初学者，这东西仅仅作为个人备份，如果能帮到忙也也不错（我开发用的php，但这是js这本身没多大影响）
这里要说明几个问题：
1.boxy调用的页面中不能出现《script》标签不然不能显示
2.boxy调用的时候要注意流程，要先加载出boxy然后再去渲染地图到boxy页面中
3.百度地图的加载js应放在弹出boxy的那个页面中
注意流程：boxy页面其实为单独的一个页面只是用了ajax中$.get('/index.php?r=comm/map_coordinate', function(data){}方法来调用页面
关键触发js如下：
(function(){
$(document).ready(function() {
$("#Mechine_mec_points").click(function(){
__MC.Map_coordinate.getcorrdinate();
});
});
__MC.Map_coordinate = {
getcorrdinate:function(){
$.get('/index.php?r=comm/map_coordinate', function(data){ //调用boxy对应的页面，页面中就只有一个id=allmap的div
new Boxy(data,{ //在外面已经加载好百度地图AIP的js
'title':'地图坐标拾取',
'modal':true,
'draggable':false,
'unloadOnHide' : true,
'afterShow' : function(){
var map = new BMap.Map("allmap");
map.centerAndZoom(new BMap.Point(106.566872, 29.536861), 17);
map.enableScrollWheelZoom(); //启用滚轮放大缩小，默认禁用
map.enableContinuousZoom(); //启用地图惯性拖拽，默认禁用
function showInfo(e){
$("#Mechine_mec_points").val(e.point.lng + ", " + e.point.lat);
}
map.addEventListener("click", showInfo);
}//aftershow结束
});
return false;
});
},
}
})();
这里要说明几个问题：
1.boxy调用的页面中不能出现《script》标签不然不能显示
2.boxy调用的时候要注意流程，要先加载出boxy然后再去渲染地图到boxy页面中
3.百度地图的加载js应放在弹出boxy的那个页面中
注意流程：boxy页面其实为单独的一个页面只是用了ajax中$.get('/index.php?r=comm/map_coordinate', function(data){}方法来调用页面
关键触发js如下：
复制代码 代码如下:
(function(){
$(document).ready(function() {
$("#Mechine_mec_points").click(function(){
__MC.Map_coordinate.getcorrdinate();
});
});
__MC.Map_coordinate = {
getcorrdinate:function(){
$.get('/index.php?r=comm/map_coordinate', function(data){ //调用boxy对应的页面，页面中就只有一个id=allmap的div
new Boxy(data,{ //在外面已经加载好百度地图AIP的js
'title':'地图坐标拾取',
'modal':true,
'draggable':false,
'unloadOnHide' : true,
'afterShow' : function(){
var map = new BMap.Map("allmap");
map.centerAndZoom(new BMap.Point(106.566872, 29.536861), 17);
map.enableScrollWheelZoom(); //启用滚轮放大缩小，默认禁用
map.enableContinuousZoom(); //启用地图惯性拖拽，默认禁用
function showInfo(e){
$("#Mechine_mec_points").val(e.point.lng + ", " + e.point.lat);
}
map.addEventListener("click", showInfo);
}//aftershow结束
});
return false;
});
},
}
})();
相关文章
这篇文章主要介绍了jQuery中queue()方法用法,实例分析了queue()方法的功能、定义及使用技巧,非常具有实用价值,需要的朋友可以参考下2014-12-12
这篇文章主要介绍了jQuery Layer弹出层传值到父页面的实现代码,需要的朋友可以参考下2017-08-08
这篇文章主要介绍了jQuery实现单击和鼠标感应事件的方法的相关资料,需要的朋友可以参考下2015-02-02
这篇文章主要介绍了基于jQuery实现最基本的淡入淡出效果的方法,实例分析了jQuery中hide、show、toggle等函数的使用技巧,需要的朋友可以参考下2015-02-02
jQuery扁平化风格下拉框美化插件FancySelect使用指南
这篇文章主要介绍了jQuery扁平化风格下拉框美化插件FancySelect使用指南,需要的朋友可以参考下2015-02-02
在开发过程中遇到了上面标题列出的问题：如何监听div内容的变化，下面是具体的解决思路，感兴趣的朋友可以参考下2013-11-11
下面小编就为大家分享一篇jQuery 防止相同的事件快速重复触发方法。具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-02-02
这篇文章主要介绍了jQuery位置选择器用法,结合实例形式分析了jQuery位置选择器的功能、用法及相关操作注意事项,需要的朋友可以参考下2019-06-06
浅析jQuery中调用ajax方法时在不同浏览器中遇到的问题
这篇文章主要介绍了jQuery中调用ajax方法时在不同浏览器中遇到的问题，因不同浏览器默认设置的不同造成的问题2014-06-06
JQuery单选按钮Radio和复选框checkbox的操作代码
这篇文章主要介绍了JQuery单选按钮Radio和复选框checkbox的操作，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-04-04
最新评论