javascript - 如何禁用 Google map 信息窗口上的下拉菜单(？)

Question

我正在使用 Ruby on Rails，并且对 JavaScript 没有太多了解(当然，我的整体编码很差)。我定制了Google Maps API并想做infowindow。然而，当我制作信息窗口时，“有时”下拉菜单会在桌面上弹出(而不是在手机中)。

我认为这不仅仅是 Google map 的问题。我认为它可以是任何 HTML、CSS 相关的问题，但毕竟不知道......这很奇怪，因为只有当餐厅的名称是某种类型时才会弹出下拉菜单(两个单词或带有一些数字的名称，但我不能认识到确切的原因和差异是什么..)

# my_javascript.js

function googleMap() {
  var geocoder = new google.maps.Geocoder();
  var restAddr = document.getElementById('address').value;
  var restName = document.getElementById("name").value;
  geocoder.geocode( { 'address': restAddr}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      var restLatLng = results[0].geometry.location

      var mapOptions = {
          zoom: 13,
          center: restLatLng
      };
      var map = new google.maps.Map(document.getElementById("map-canvas"),mapOptions);

      var marker = new google.maps.Marker({
          map: map,
          position: restLatLng
      });

      var infoWindow = new google.maps.InfoWindow({
          //maxWidth: 100, it didn't work
          content: restName // **this part is the problem. When the restName is like "new york", "house 2"(some with one-digit(?)-number). but not when the restName is "new york stree" kind. **
      });
      infoWindow.open(map, marker);

    } else {
      alert('Geocode was not successful for the following reason: ' + status);
    }
  });
}
window.onload = googleMap

这是我的 View 文件。

# app/views/home/page.html.erb

<%= @rest.addr %>
<p>changed</p>

<input type="hidden" id="address" value="<%= @rest.addr %>">
<input type="hidden" id="name" value="<%= @rest.name %>">
<div id="map-canvas"></div>

有人可以帮我提供一些建议吗？任何评论都会对我很有帮助，让我了解更多编程知识。谢谢!!

Answer 1

您必须获取 da DIV 中的 infowindow 内容并使用 css 设置 div 的样式。 在你的情况下做 '<div class="scrollFix">'+restName+'</div>'将 div 属性设置为:

.scrollFix {
    line-height: 1.35;
    overflow: hidden;
    white-space: nowrap;
}

这是一个工作示例: http://jsfiddle.net/veaz/7Zm8w/