首页 > 解决方案 > javascript getElementsByClassName 不适用于多个输入

问题描述

我正在尝试实现谷歌城市名称。我的代码是

<script src="https://maps.googleapis.com/maps/api/js?key=API_KEY&libraries=places"></script>
    <script>
            function init() {
                var input = document.getElementsByClassName('place');
                var autocomplete = new google.maps.places.Autocomplete(input);

            }

            google.maps.event.addDomListener(window, 'load', init);

        </script>

我在页面上有许多表单,其中包含输入“地点”的多个实例

<input type="text" class="place"  name="femaleplace" placeholder="Place of Birth" required>
<input type="text" class="place"  name="maleplace" placeholder="Place of Birth" required>

但是没有任何效果。当我在页面上只有一个输入“地点”实例时,getElementById 工作正常。

标签: javascript

解决方案


这行得通

function init() {
      var input = document.getElementsByClassName('place');
      for (i = 0; i < input.length; i++) {
        autocomplete = new google.maps.places.Autocomplete(input[i]);
}
}
            google.maps.event.addDomListener(window, 'load', init);

推荐阅读