完全删除GoogleMaps自动填充的正确方法是什么？ [英] What is the correct way to completely remove GoogleMaps Autocomplete?

问题描述

我使用GoogleMap v3 自动完成，我需要彻底删除它并取消绑定所有事件监听器。我初始化和绑定事件的代码如下所示：

  var autocomplete = new google.maps.places.Autocomplete（$ （input）。get（0），{
 types：[geocode] 
}）; 
 
 google.maps.event.addListener（autocomplete，'place_changed'，function（）{
 //处理事件
}）; 
  

我找不到正确删除自动填充和解除所有事件的正式方法。请指点正确的方式。

谢谢。

未绑定的事件使用 google.maps.event.clearInstanceListeners 。

对于删除自动完成功能，没有实现的方法。
您可以在创建完成之前创建输入的克隆，并且当您要删除自动完成功能时，请用克隆替换当前输入。

  // ------------------------------------------ -------------------- //这覆盖了内置的Autocomplete并添加了一个删除侦听器//在API加载时执行一次（function（ac ）{google.maps.places.Autocomplete = function（node，opts）{var clone = node.cloneNode（true），pac = new ac（node，opts）; google.maps.event .addListener（pac，'remove' ，function（restore）{google.maps.event.clearInstanceListeners（pac）; google.maps.event.trigger（node，'blur'）; google.maps.event.clearInstanceListener S（节点）; if（restore === true）{node.parentNode.replaceChild（clone，node）; } else {node.parentNode.removeChild（node）}}）;返回pac; }}（google.maps.places.Autocomplete））; // ----------------------------------- --------------------------------------- function initialize（）{autocomplete = new google.maps .places .Autocomplete（document.getElementsByTagName（'INPUT'）[0]，{types：[geocode]}）; } google.maps.event.addDomListener（window，'load'，initialize）;  

 < script src =https://maps.googleapis.com/maps/api/js?v=3&libraries=places&.js>< / script>< input / ><跨度> < input type =buttonvalue =remove inputonclick =google.maps.event.trigger（window.autocomplete，'remove'）; this.parentNode.parentNode.removeChild（this.parentNode）;/> ; < input type =buttonvalue =remove autocomplete-functionalityonclick =google.maps.event.trigger（window.autocomplete，'remove'，true）; this.parentNode.parentNode.removeChild（this.parentNode） ;/>< span>  

删除监听器到Automplete的。
监听器接受一个参数。如果您只想移除自动填充功能，请将其设置为 true 。否则，输入将被完全删除。

I use GoogleMap v3 AutoComplete and I need to completely remove it and unbind all event listeners. My code for initializing and binding to events looks like the following:

var autocomplete = new google.maps.places.Autocomplete($("input").get(0), {
   types: ["geocode"]
});

google.maps.event.addListener(autocomplete, 'place_changed', function () {
  // handle events
});

I don't find official way to correctly remove autocomplete and unbind all events. Please point me the right way.

Thanks.

解决方案

For the unbinding of events use google.maps.event.clearInstanceListeners.

For removing of the autocomplete-functionality there is no implemented method. You may create a clone of the input before you create the Automplete and when you want to remove the autocomplete-functionality replace the current input with the clone.

//--------------------------------------------------------------
      //this overides the built-in Autocomplete and adds a remove-listener
      //execute it once when the API has been loaded
     (function(ac) {
         google.maps.places.Autocomplete = function(node, opts) {
           var clone = node.cloneNode(true),
             pac = new ac(node, opts);

           google.maps.event
             .addListener(pac,
               'remove',
               function(restore) {
                   google.maps.event.clearInstanceListeners(pac);
                   google.maps.event.trigger(node,'blur');
                   google.maps.event.clearInstanceListeners(node);
                 if (restore===true) {
                   node.parentNode.replaceChild(clone, node);
                 } else {
                   node.parentNode.removeChild(node)
                 }
               });
           return pac;

         }
       }
       (google.maps.places.Autocomplete));
//-------------------------------------------------------------------------- 

     function initialize() {

       autocomplete = new google.maps.places
         .Autocomplete(document.getElementsByTagName('INPUT')[0], {
           types: ["geocode"]
         });
     }

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

<script src="https://maps.googleapis.com/maps/api/js?v=3&libraries=places&.js"></script>
<input/>
<span>
  <input  type="button"  value="remove input" 
          onclick="google.maps.event.trigger(window.autocomplete,'remove');
                   this.parentNode.parentNode.removeChild(this.parentNode);"/>
  <input  type="button"  value="remove autocomplete-functionality" 
          onclick="google.maps.event.trigger(window.autocomplete,'remove',true);
                   this.parentNode.parentNode.removeChild(this.parentNode);"/>
<span>

The script adds a remove-listener to Automplete's. The listener accepts a single argument. Set it to true when you only want to remove the autocomplete-functionality. Otherwise the input will be removed completely.

这篇关于完全删除GoogleMaps自动填充的正确方法是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！