在同一页面上的iframe内处理父窗口中的Google地图标记

时间:2011-10-20 20:58:41

标签: jquery jquery-ui google-maps dom fancybox

我在<script>元素中运行以下JavaScript来初始化我通过AJAX在jQuery UI选项卡中加载的页面中的Google地图:

var tab_index = $('#tabs').tabs('option', 'selected');

var myOptions = {
    zoom: 8,
    center: new google.maps.LatLng(18.735693,-70.162651),
    mapTypeId: 'roadmap',
    mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}
}

MapID = $('.site_map:visible').attr('id');

if (MapID !== 'map-new') {
    var map_id = 'map-'+tab_index;
    $('.site_map:visible').attr('id', map_id);
    var tab_map = new google.maps.Map(document.getElementById(map_id), myOptions);
    placeMarker($('.site_details:visible .inpLat').val(), $('.site_details:visible .inpLng').val(), tab_map);
}

之后,我通过Fancybox加载iframe。我从Fancybox iframe中获取两个变量,我传递给父窗口中的隐藏输入(包含带有地图的选项卡),如下所示:

$('form:visible .inpLat', window.parent.document).val(myCoords.lat());
$('form:visible .inpLng', window.parent.document).val(myCoords.lng());

我的问题是,如何将这两个变量传递到父页面上的地图并使用它们来更新地图中标记的位置?

1 个答案:

答案 0 :(得分:1)

我明白了;事实证明,您可以通过将parent.放在其前面来引用父页面可用的功能,如下所示:

parent.placeMarker(myCoords.lat(), myCoords.lng());