Question

我正在尝试将Wordpress中的Google自动完成字段添加到我的functions.php文件中。

我添加了以下代码：

function initAutocomplete() {
    if (is_page ('9')) { 
        ?>
            <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&key=API_KEY&libraries=places"></script>
            <script type="text/javascript">
                var input = document.getElementById('autocomplete');
                var autocomplete = new google.maps.places.Autocomplete(input);
            </script>
        <?php
    }
}
add_action('wp_head', 'initAutocomplete');

自动完成是HTML对象中字段的ID。

<div id="locationField">
  <input id="autocomplete"
         placeholder="Enter your address"
         type="text"/>
</div>

我收到此错误：

InvalidValueError：不是HTMLInputElement的实例

我已经确保它是一个实际的输入字段。我只是在实现上错了吗？

Answer 1

想通了！

function initAutocomplete() {
    if (is_page ('compost-intake-form')) { 
        ?>
            <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&key=API_KEY&libraries=places"></script>
            <script type="text/javascript">
            jQuery(document).ready(function ($) {
                $(function(){
                  var complete;
                  var input = $("#autocomplete")[0];
                  complete = new google.maps.places.Autocomplete(input);
                });
            });
            </script>
        <?php
    }
}
add_action('wp_head', 'initAutocomplete');

[0]用于从变量中选择HTML元素。

Got it from here.

InvalidValueError：不是HTMLInputElement的实例-带有Wordpress的Google自动完成功能

1 个答案: