web-dev-qa-db-fra.com

Événements autres que "lieu_changed" pour la saisie automatique de Google Maps

J'ai une application qui se déclenche correctement sur place_changed.

Cependant, je souhaite que la recherche par branche se comporte différemment lorsqu'un utilisateur a sélectionné une entrée de saisie semi-automatique et lorsqu'il a saisi lui-même du texte sans l'aide de la saisie semi-automatique.

Quel type d'auditeur d'événements dois-je utiliser pour faire la distinction? Je ne trouve pas de documentation sur d'autres événements pour la saisie automatique de Google Maps.

ce que j'ai maintenant:

var gmaps = new google.maps.places.Autocomplete($("#searchproperties").get(0), 
{ types: ['geocode'], componentRestrictions: {country: 'us'} });

google.maps.event.addListener(gmaps, 'place_changed', function () {
    //FIRE SEARCH
});
javascriptjquerygoogle-mapsgoogle-maps-api-3autocomplete
36
Wesley

L'API Javascript de Google Maps v3 contient un seul événement documenté pour la classe google.maps.places.Autocomplete , place_changed

Vous pouvez y ajouter des écouteurs d'événements HTML standard (vous ne savez pas si cela affectera la fonctionnalité de saisie semi-automatique).

10
geocodezip

Cela revient à vérifier si vous recevez un objet place.geometry, comme il est montré dans leur exemple officiel . Aussi simple que cela!

function initialize() {

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

  ac.addListener('place_changed', function() {

    var place = ac.getPlace();

    if (!place.geometry) {
      // User entered the name of a Place that was not suggested and
      // pressed the Enter key, or the Place Details request failed.
      // Do anything you like with what was entered in the ac field.
      console.log('You entered: ' + place.name);
      return;
    }

    console.log('You selected: ' + place.formatted_address);
  });
}

initialize();
#autocomplete {
  width: 300px;
}
<input id="autocomplete" placeholder="Enter your address" type="text"></input>
<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>

4
MrUpsidown

Si vous ajoutez votre propre gestionnaire d'entrée (par exemple, en capturant le CR après que l'utilisateur a saisi son propre texte), la saisie semi-automatique et votre fonction peuvent appeler votre méthode dos à dos. Ma solution consiste à utiliser la manette pour éviter l'appel répété:

$('#sell_address_input').keyup(function(e){ if(e.keyCode==13){throttle(addressEntered(),1000)}});

....

function throttle(callback, limit) {
    var wait = false;             // Initially, we're not waiting
    return function () {          // We return a throttled function
        if (!wait) 
        {                         // If we're not waiting
          callback.call();        // Execute users function
          wait = true;            // Prevent future invocations
          setTimeout(function () 
          {                       // After a period of time
            wait = false;         // And allow future invocations
          }, limit);
        }
    }
}
2
Glen Ocal