javascript - 在 div 中调用 javascript 函数

标签 javascript html css twitter-bootstrap google-maps-api-3

我正在关注 Google Map API 教程 here ,特别是 JAVASCRIPT + HTML 版本。我相信相关部分是

<body>
    <div id="map"></div>
    <script>

var map;
function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -34.397, lng: 150.644},
    zoom: 8
  });
}

我正在尝试为包含两个流体容器的页面使用 Bootstrap ,其中一个将包含 map 。我正在关注这个 fluid layout example从 Bootstrap 。所以我有类似的东西

<div class="container-fluid">
  <div class="row-fluid">
<div class="span2">
  {% for q in qs %}
    <p>{{ q.name }} {{ q.address}}</p>
  {% endfor %}
</div>
<div class="span10" id="map"></div>
</div>
</div>

它不显示 map 。我想知道是否

<div class="span10" id="map"></div>

是正确的做法,我是否应该更改其他任何内容。

编辑:

<div id="map"></div> <- This works
<div class="container-fluid">
  <div class="row-fluid">
    <div class="span2"></div>
    <div class="span10" id="map"></div> <- This doesn't work
  </div>
</div>

最佳答案

改变

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -34.397, lng: 150.644},
    zoom: 8
  });
}

(function () {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -34.397, lng: 150.644},
    zoom: 8
  });
}())

关于javascript - 在 div 中调用 javascript 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34428249/

相关文章:

javascript - 制作拖动条以调整 CSS 网格内的 div 大小

javascript - 在内部,每个数组元素如何传递给 javascript 中 "map"函数内部使用的回调函数

css - 在 WebGrid 列中环绕文本

html - 将我的 html-css 设计整合到 ruby​​ on rails 中

javascript - 与 Angular (4.0.0) 和 Material 2.0.0-beta.8 的数据绑定(bind)

javascript - 配置 watchify 和 browserify 以仅重新运行所需的文件

html - 尝试制定自定义 CSS 组织结构图;我的 div 不能正确放置

html - 使这些文本框对齐的正确 css 宽度是多少?

php - 下拉选择 onchange 更新多个 div

html - CSS 伪元素 :before & :after work differently in Internet Explorer