InvalidValueError：不是HTMLInputElement的实例-Shopify

Question

我有一个带搜索栏的shopify网站，我在其中使用googles自动完成API，这很好用。出于某些原因，打开控制台时会在控制台中收到此错误：

InvalidValueError: not an instance of HTMLInputElement

我检查了类似的帖子，并确保在HTML末尾加载JS，这是我的JS代码：

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js? 
key=MY_KEY&libraries=places"></script>
<script>
var input = document.getElementById('pac-input');

var options = {
componentRestrictions: {country: 'ca'}
};

var autocomplete = new google.maps.places.Autocomplete(input, options);

</script>

这是我的搜索框HTML：

 <input id="pac-input" class="search_bar" type="text" placeholder="Enter Delivery Address" name="q" value="{{ search.terms | escape }}"  />
<input class="search_butt" type="submit" value="Shop Now" />

据我所知，我的文本框元素的ID完全相同，并且我的脚本位于HTML文档的末尾，是否缺少我的东西？

谢谢