完全删除 GoogleMaps 自动完成的正确方法是什么?
What is the correct way to completely remove GoogleMaps Autocomplete?
我使用 GoogleMap v3 AutoComplete,我需要完全删除它并取消绑定所有事件侦听器。我的初始化和绑定事件的代码如下所示:
var autocomplete = new google.maps.places.Autocomplete($("input").get(0), {
types: ["geocode"]
});
google.maps.event.addListener(autocomplete, 'place_changed', function () {
// handle events
});
我没有找到正确删除自动完成和取消绑定所有事件的正式方法。请指点我正确的方法。
谢谢。
对于事件的解除绑定使用google.maps.event.clearInstanceListeners
。
对于删除自动完成功能,没有实现的方法。
您可以在创建 Automplete 之前创建输入的克隆,并且当您想要删除自动完成功能时,将当前输入替换为克隆。
//--------------------------------------------------------------
//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
。否则输入将被完全删除。
我使用 GoogleMap v3 AutoComplete,我需要完全删除它并取消绑定所有事件侦听器。我的初始化和绑定事件的代码如下所示:
var autocomplete = new google.maps.places.Autocomplete($("input").get(0), {
types: ["geocode"]
});
google.maps.event.addListener(autocomplete, 'place_changed', function () {
// handle events
});
我没有找到正确删除自动完成和取消绑定所有事件的正式方法。请指点我正确的方法。
谢谢。
对于事件的解除绑定使用google.maps.event.clearInstanceListeners
。
对于删除自动完成功能,没有实现的方法。 您可以在创建 Automplete 之前创建输入的克隆,并且当您想要删除自动完成功能时,将当前输入替换为克隆。
//--------------------------------------------------------------
//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
。否则输入将被完全删除。