将数据传递给模态(bootstrap)

时间:2013-09-09 08:46:07

标签: javascript google-maps twitter-bootstrap

我在谷歌地图上有多个标记,当我点击它们时,我需要打开一个模态窗口。问题是每个标记都有一个特定的id,我需要每个模态中的id。

模态html是:

<div class="modal fade" id="imageModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Modal title</h4>
      </div>
      <div class="modal-body">
      </div>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
  </div>
</div>

调用此函数的javascript代码是:

function createMarker(pos, t, map) {
    var marker = new google.maps.Marker({
        position: pos,
        map: map,  // google.maps.Map
        index: t
    });
    google.maps.event.addListener(marker, 'click', function() {
      $('#imageModal').modal();
      //alert("I am marker " + marker.index);
    });
    return marker;
 }

所以在imageModal中我需要访问动态的marker.index信息。我怎样才能做到这一点?任何想法?

1 个答案:

答案 0 :(得分:0)

首先,我认为index在Google Maps v3中不是MarkerOption

我是如何得到这个的,我在MarkerOption中使用了title选项并将其设置为动态字符串,然后在addListener事件中访问它。

以下是您可以这样做的方法:

function createMarker(pos, t, map) {
    var marker = new google.maps.Marker({
        position: pos,
        map: map,  // google.maps.Map
        title: t   //where t must be a string
    });
    google.maps.event.addListener(marker, 'click', function() {
      $('#imageModal').modal();
      alert("I am marker " + this.getTitle() );  
    });
 }

希望这可以帮助你!!