Comportement JavaScript le plus fou que j'ai jamais vu

Et c'est de dire quelque chose. Ceci est basé sur l'exemple de Google Maps pour Directions dans l'API Google Maps v3.Comportement JavaScript le plus fou que j'ai jamais vu

<html> 
<head> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
<title>Google Directions</title> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript"> 
var directionDisplay; 
var directionsService = new google.maps.DirectionsService(); 
var map; 


function initialize() { 
    directionsDisplay = new google.maps.DirectionsRenderer(); 

    var myOptions = { 
     zoom:7, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
    directionsDisplay.setMap(map); 
    directionsDisplay.setPanel(document.getElementById("directionsPanel")); 
} 

function render() { 
    var start; 

    if(navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(function(position) { 
      start = new google.maps.LatLng(position.coords.latitude,position.coords.longitude); 
     }, function() { 
      handleNoGeolocation(browserSupportFlag); 
     }); 
     } else { 
     // Browser doesn't support Geolocation 
     handleNoGeolocation(); 
    } 

    alert("booga booga"); 


    var end = '<?= $_REQUEST['destination'] ?>'; 
    var request = { 
     origin:start, 
     destination:end, 
     travelMode: google.maps.DirectionsTravelMode.DRIVING 
    }; 
    directionsService.route(request, function(response, status) { 
     if (status == google.maps.DirectionsStatus.OK) { 
     directionsDisplay.setDirections(response); 
     } 
    }); 
} 

</script> 
</head> 
<body style="margin:0px; padding:0px;" onload="initialize()"> 
<div><div id="map_canvas" style="float:left;width:70%; height:100%"></div> 
<div id="directionsPanel" style="float:right;width:30%;height 100%"></div> 
<script type="text/javascript">render();</script> 
</body> 
</html>

Voir cela "alerte ('booga booga')" là dedans?

Avec cela en place, tout cela fonctionne fantastique. Commentez cela, et var start est indéfini lorsque nous tapons la ligne pour définir la requête var.

J'ai découvert quand je l'ai enlevé l'alerte que je mets là-bas pour me montrer la valeur de début var, et cesser de travailler. Si je lui demande de m'avertir de la valeur de var start, il me dit qu'il n'est pas défini, MAIS il a une valeur valide (et précise!) Lorsque nous définissons var request quelques lignes plus tard.

Je doutât est un problème de synchronisation - comme une chose asynchrone est d'avoir le temps de terminer en arrière-plan dans le moment qu'il me faut pour rejeter l'alerte. Des idées sur les solutions de rechange?

Source

2010-05-11 Dan Ray

+1 cause à booga booga lol – user318747

Heh. Je dois vous dire, quand je l'ai changé de me parler de la variable en question à me dire une chaîne aléatoire et il a échoué encore sans cela ... Ouf. –

Qu'est-ce que vous supposez est correct navigator.geolocation.getCurrentPosition() est un appel asynchrone terminé alors que vous êtes rejeté cette alerte. Pour résoudre ce problème, vous devez continuer votre travail à partir de ou dans la fonction de rappel. Pour ce faire, réorganiser votre code pour se produire quand il se termine, comme ceci: m'a fait

function render() { 
    if(navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(function(position) { 
      var start = new google.maps.LatLng(position.coords.latitude,position.coords.longitude); 
      var end = '<?= $_REQUEST['destination'] ?>'; 
      var request = { 
       origin:start, 
       destination:end, 
       travelMode: google.maps.DirectionsTravelMode.DRIVING 
      }; 
      directionsService.route(request, function(response, status) { 
      if (status == google.maps.DirectionsStatus.OK) { 
       directionsDisplay.setDirections(response); 
      } 
      }); 
     }, function() { 
      handleNoGeolocation(browserSupportFlag); 
     }); 
     } else { 
     // Browser doesn't support Geolocation 
     handleNoGeolocation(); 
    } 
}

Source

2010-05-11 15:13:44

C'est ce qu'il a fait. Je vous remercie!! –

Le "quelque chose d'asynchrone" est l'appel à getCurrentPosition. L'alerte prend un certain temps, de sorte que l'appel peut se terminer et appeler le rappel qui définit la valeur de "start".

Vous pouvez essayer de déplacer l'ensemble de bourre code à partir de laquelle vous définissez « demande » vers le haut dans le rappel sur getCurrentPosition. Cela le retarderait jusqu'à ce que "start" soit définitivement défini sur une valeur utilisable.

éditer oui comme Nick montre dans son exemple.

Source

2010-05-11 15:13:02 Pointy

Oui. A travaillé comme un champion. Merci! –

Comportement JavaScript le plus fou que j'ai jamais vu

Répondre

Questions connexes