web-dev-qa-db-ja.com

Googleプレイスのオートコンプリートを削除する方法はありませんか?

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

今それを削除するにはどうすればよいですか?

「autocomplete.unbindAll()」関数がありますが、ドロップダウンボックスのHTMLは削除されません。私は多くの厄介なことをするページを持っています、そしてこのドロップダウンボックスのためにページの特定の時間にオートコンプリートが1つしかない場合でも追加され続けます:|

13
thelolcat

これが物事が初期化された方法であると仮定して

var autocomplete = new google.maps.places.Autocomplete(input, {types: ['geocode']});
var autocompleteLsr = google.maps.event.addListener(autocomplete, 'place_changed', function() { ... });

グーグルマップAPIは、削除用のremoveListenerとclearInstanceListenersも提供します。 https://developers.google.com/maps/documentation/javascript/reference#event

また、オプションの手順として、この$( "。pac-container")も削除する必要があります

google.maps.event.removeListener(autocompleteLsr);
google.maps.event.clearInstanceListeners(autocomplete);
$(".pac-container").remove();
18
Prabhu

古い投稿ですが、誰かの助けになるので、今すぐお答えしたいと思います。

オートコンプリートインスタンスでリスナーまたはunbindall()を削除しても、自動提案の発生は削除されません。また、DOMから「.pac-container」を削除することはクリーンな解決策ではありません。

オートコンプリートの新しいインスタンスは、入力要素がオートコンプリートインスタンスにフックされていることを意味するため、オートコンプリートインスタンスではなく、入力要素のリスナーをクリアする必要があります。

google.maps.event.clearInstanceListeners(input);

4
smhnkmr

代わりに(また?)autocomplete.unbindAll()を呼び出しているところはどこでも、input.parentNode.removeChild(input)を呼び出しますか?それは本質的に GoogleMapsオートコンプリートを完全に削除する正しい方法は何ですか? への優れた答えで起こっていることです

ただし、その質問とは異なり、「複数のドロップダウンボックス」について不平を言います。

実際の問題は、new google.maps.places.Autocomplete(...)を複数回呼び出していることのようです。異なるinputノードに対して。あなたはそれを避けられませんか?新しいノードを「作成」する場合は、JS DOM APIを使用して、「初期化された」ノードをドキュメント内の現在使用する場所にプルします。一時的に見えないようにしたい場合は非表示にします。

バインディングフレームワークを使用している場合は少し難しいように見えますが、どういうわけか、それが何をしているのかからnew Autocompleteへの呼び出しを取得する必要があります。

1
David Bullock

$(".pac-container").remove();を使用すると、ページを更新または変更するまでオートコンプリートが再び表示されないことがわかりました。そのため、SPAではうまく機能しません。私はあなたがこれを使うことができて、それがうまくいくことを発見しました:

autocomplete.addListener('place_changed', function () {
    $('.pac-item').remove();
  });
0
karoluS