0

我正在尝试根据用户搜索表单动态更改 Gmaps4Rails 中的标记。我正在使用下面的代码。

我遇到的问题是 $('#locations_search').submit 中对 Gmaps.map.replaceMarkers 的调用给出了错误：Gmaps.map 未定义。

我使用 javascript 调试器进行了检查，确实，一旦我进入提交函数（我在那里有一个断点）， Gmaps.map 是未定义的。当 Gmaps.map.callback 的第一行中的断点停止时，对象 Gmaps.map 被定义。

可能我错过了一些东西。这里似乎是一些变量范围问题？

Gmaps.map.callback = function() {

  var firstMarker = Gmaps.map.markers[0];
  var map         = Gmaps.map.map;
  firstMarker.infowindow.open(map, firstMarker.serviceObject);

  $('#locations_search').submit(function () {
    var url = '/locations.json/?' + $(this).serialize();
    $.getJSON(url, function(data){
                Gmaps.map.replaceMarkers(data);
            });
    $.get(this.action, $(this).serialize(), null, 'script');
    return false;
  });
}

非常感谢！

4

1 回答 1

0

这只是脚本顺序的问题。

Gmaps.map当您调用其中一个gmaps或gmaps4rails助手时，会在您的视图中创建。

解决方案：

  • 在调用 gem 的助手后添加脚本

  • 将您的 js 代码包装在<% content_for :scripts do %> code <% end %>

在你看来：

<%= gmaps(...) %>
<% content_for :scripts do %>
<script type="text/javascript"> 
  Gmaps.map.callback = function() { ... }
</script>
<% end %>

Gmaps.map.callback = function() {

  var namespace   = Gmaps.map;
  var firstMarker = namespace.markers[0];
  var map         = namespace.map;
  firstMarker.infowindow.open(map, firstMarker.serviceObject);

  $('#locations_search').submit(function () {
    var url = '/locations.json/?' + $(this).serialize();
    $.getJSON(url, function(data){
            namespace.replaceMarkers(data);
        });
    $.get(this.action, $(this).serialize(), null, 'script');
    return false;
  });
}
于 2012-08-26T19:10:25.580 回答