wake-up-neo.com

So lösen Sie ein place_changed-Ereignis für Google-Bereiche aus, die automatisch auf die Eingabetaste vervollständigt werden

Der Klick scheint das Ereignis auszulösen und die Cookies zu setzen, aber durch Drücken der Eingabetaste zum Senden werden die Cookies nicht gesetzt und stattdessen wird die Seite ohne die Cookies weitergeleitet.

function locationAuto() {
        $('.search-location').focus(function () {
        autocomplete = new google.maps.places.Autocomplete(this);
        searchbox = this;

        google.maps.event.addListener(autocomplete, 'place_changed', function () {
            var thisplace = autocomplete.getPlace();
            if (thisplace.geometry.location != null) {
                $.cookie.raw = true;
                $.cookie('location', searchbox.value, { expires: 1 });
                $.cookie('geo', thisplace.geometry.location, { expires: 1 });
            }
        });
});

Der .search-Speicherort ist eine Klasse für mehrere Textfelder. Es gibt eine Senden-Schaltfläche, die die Werte aus den Cookies und Weiterleitungen übernimmt (Server-Seite)

34
John Stephenson

Nach Jonathan Caulfields Antwort:

$('.search-location').keypress(function(e) {
  if (e.which == 13) {
    google.maps.event.trigger(autocomplete, 'place_changed');
    return false;
  }
});
40
Marcelo

Ich bin auch auf dieses Problem gestoßen und habe eine gute Lösung gefunden. Auf meiner Website wollte ich die Datei autocomplete.getPlace (). Formatted_address vor dem Absenden in einer versteckten Eingabe speichern. Dies funktionierte beim Klicken auf die Senden-Schaltfläche des Formulars erwartungsgemäß, jedoch nicht beim Drücken der Eingabetaste bei der Auswahl im Dropdown-Menü der automatischen Vervollständigung. Meine Lösung war wie folgt:

$(document).ready(function() {

    // Empty the value on page load
    $("#formattedAddress").val("");
    // variable to indicate whether or not enter has been pressed on the input
    var enterPressedInForm = false;

    var input = document.getElementById("inputName");
    var options = {
      componentRestrictions: {country: 'uk'}
    };
    autocomplete = new google.maps.places.Autocomplete(input, options);

    $("#formName").submit(function(e) {
        // Only submit the form if information has been stored in our hidden input
        return $("#formattedAddress").val().length > 0;
    });

    $("#inputName").bind("keypress", function(e) {
        if(e.keyCode == 13) {
            // Note that simply triggering the 'place_changed' event in here would not suffice, as this would just create an object with the name as typed in the input field, and no other information, as that has still not been retrieved at this point.

            // We change this variable to indicate that enter has been pressed in our input field
            enterPressedInForm = true;
        }
    });

    // This event seems to fire twice when pressing enter on a search result. The first time getPlace() is undefined, and the next time it has the data. This is why the following logic has been added.
    google.maps.event.addListener(autocomplete, 'place_changed', function () {
        // If getPlace() is not undefined (so if it exists), store the formatted_address (or whatever data is relevant to you) in the hidden input.
        if(autocomplete.getPlace() !== undefined) {
            $("#formattedAddress").val(autocomplete.getPlace().formatted_address);
        }
        // If enter has been pressed, submit the form.
        if(enterPressedInForm) {
            $("#formName").submit();
        }
    });
});

Diese Lösung scheint gut zu funktionieren.

5
Liran H

Beide oben genannten Antworten sind gute Antworten auf die allgemeine Frage, eine Frage auszulösen, wenn der Benutzer die Eingabetaste drückt. Ich bin jedoch auf ein spezifischeres Problem gestoßen, als ich Google Places Autocomplete verwendet habe, das möglicherweise Teil des OP-Problems war. Damit das place_changed -Ereignis nützlich ist, muss der Benutzer eine der Autocomplete-Optionen ausgewählt haben. Wenn Sie nur 'place_changed' auslösen, wird der if () -Block übersprungen und der Cookie nicht gesetzt.

Auf den zweiten Teil der Frage gibt es hier eine sehr gute Antwort: https://stackoverflow.com/a/11703018/1314762

HINWEIS: Die Antwort von amirnissim, nicht die gewählte, sollte aus Gründen verwendet werden, die auftreten, wenn Sie mehr als eine automatische Vervollständigungseingabe auf derselben Seite haben.

5
Don McCurdy

Möglicherweise nicht die benutzerfreundlichste Lösung, aber Sie könnten JQuery verwenden, um die Eingabetaste zu deaktivieren.

Etwas wie das...

$('.search-location').keypress(function(e) {
  if (e.which == 13) {
    return false;
  }
});
1
Jonny C