5

我使用谷歌地图v3 AutoComplete,我需要完全删除它并解除所有事件监听器。我的初始化和结合事件的代码如下所示:什么是完全删除GoogleMaps自动填充的正确方法?

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

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

我没有找到正式的方式来正确删除自动完成和取消绑定的所有事件。请指点正确的方法。

谢谢。

回答

8

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

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

//-------------------------------------------------------------- 
 
     //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>

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

+0

感谢您的完整答案。请解释下列方法有什么区别:'clearInstanceListeners','clearListeners'和'removeListener'。我应该使用它们全部还是我使用'clearInstanceListeners'就足够了? – Erik 2015-02-11 20:14:36

+0

'removeListener'移除特定的侦听器,'clearListeners'从给定对象中移除特定事件的所有侦听器,'clearInstanceListeners'从给定对象中移除所有侦听器(不管事件类型)。这足以使用'clearInstanceListeners' – 2015-02-11 22:37:30

+0

感谢您的帮助! – Erik 2015-02-12 15:19:46

相关问题