Google通过类名将自动填充功能无法正常工作

Question

嗨我有一个文本框和焦点它自动完成的地方,街道,如果我选择id,我的名字这项工作,但后来我有很多动态文本框控制所以我有固定的类名,相同的代码不工作如果我选择classname

JS FIDDLE DEMO

码:

 getPlace();
 getPlace_dynamic();

     function getPlace() {
         var defaultBounds = new google.maps.LatLngBounds(
         new google.maps.LatLng(-33.8902, 151.1759),
         new google.maps.LatLng(-33.8474, 151.2631));
         var input = document.getElementById('Destination');
         // var input = document.getElementsByClassName('destination');
         var options = {
             bounds: defaultBounds,
             types: ['establishment']
         };
         autocomplete = new google.maps.places.Autocomplete(input, options);
     }

     function getPlace_dynamic() {
         var defaultBounds = new google.maps.LatLngBounds(
         new google.maps.LatLng(-33.8902, 151.1759),
         new google.maps.LatLng(-33.8474, 151.2631));

         var input = document.getElementsByClassName('myClass');
         var options = {
             bounds: defaultBounds,
             types: ['establishment']
         };
         autocomplete = new google.maps.places.Autocomplete(input, options);
     }

---

<input id="Destination" tabindex="1" class="txt_box" type="text" />
</br>
</br>Later Dynamically generated
<input tabindex="1" class="myClass" type="text" />
<input tabindex="1" class="myClass" type="text" />

Answer 1

document.getElementsByClassName('myClass')

返回具有该className(myClass)的元素数组.

因此,您需要做的是迭代每个元素并将其分配给Google自动完成API,如下所示

for (i = 0; i < input.length; i++) {
        autocomplete = new google.maps.places.Autocomplete(input[i], options);
}

的jsfiddle