2013-04-11 4 views
-1

Je viens de commencer à expérimenter avec la géolocalisation dans les pages web.Javascript/HTML5 Géolocalisation en utilisant le fichier js externe

J'ai trouvé l'extrait de code utile sur W3Schools (http://www.w3schools.com/html/html5_geolocation.asp) qui fonctionne. Ce que je suis un peu perplexe cependant, c'est que SI je mets le bloc (moins les tags) dans un fichier .js séparé, appelez le fichier js dans le de ma page, le code ne fonctionne pas du tout. Pourquoi est-ce? Je voudrais avoir le code de travail final dans son propre fichier .js que je peux référencer à partir de n'importe quelle page.

Le fichier js est dans le même dossier que le fichier htm/php

Dès que je retourne le script dans le corps de ma page, cela fonctionne. Quelqu'un pourrait-il m'aider à comprendre la cause de cela s'il vous plaît? (Si cela fait une différence, j'utilise Firefox 20


index.php

<!DOCTYPE html> 
    <html> 
    <head> 
    <script type="application/javascript" src="geo.js"></script> 

    <title> 
     TEST 3: GeoLocation 
    </title> 
    </head> 
    <body> 
    <p id="demo">Click the button to get your coordinates:</p> 
    <button onclick="getLocation()">Try It</button> 
    </body> 
</html> 

geo.js

var x=document.getElementById("demo"); 

function getLocation(){ 
if (navigator.geolocation){ 
    navigator.geolocation.getCurrentPosition(showPosition); 
} 
else{ 
    x.innerHTML="Geolocation is not supported by this browser."; 
} 
} 

function showPosition(position){ 
x.innerHTML="Latitude: " + position.coords.latitude + 
"<br />Longitude: " + position.coords.longitude;  
} 
+0

son travail pour moi: http://jsbin.com/ovabez/1/edit –

+0

@PrakashChennupati, en effet il le fait. Mais sur mon serveur ça ne marche pas du tout. Est-ce que quelque chose sur le serveur pourrait causer cela? Code du travail: http://bit.ly/Yp0HUZ Code de non-travail (JS dans un fichier externe): http://bit.ly/10VS7ZU – Salem874

+0

essayer cette changer votre balise script aussi: ' ' –

Répondre

0

De commentaire en question: Indeed it does. But on my server it doesnt at all. Could something on the server be causing this? Working Code: bit.ly/Yp0HUZ Non-Working Code (JS in external file): bit.ly/10VS7ZU –

Référencement de vos liens: Il manque l'attribut ID id="btnTryIt" sur votre bouton sur votre serveur. Lorsque vous essayez de désactiver l'objet null, une exception est levée et l'exécution de code s'arrête.

+0

Bon point Althugh Je doute que ce soit la cause ajouté à la version "one-file" après avoir posté ici Après avoir ajouté l'ID au

+0

Il y a maintenant une autre erreur de console sur la ligne qui indique que x est null. g le script au bas de la page comme 'demo' pourrait ne pas être chargé lorsque vous essayez de le récupérer. –

+0

Merci Ben, cela a résolu le problème. – Salem874

0

J'ai eu le même problème. La variable x était toujours nulle. Je pense que cela s'est produit parce que lorsque vous ajoutez votre fichier js externe à l'en-tête, la variable locale x est nulle car l'élément auquel elle fait référence n'a pas encore été créé.

Essayez d'ajouter

<script type="text/javascript" language="javascript"> x = document.getElementById("demo"); </script>

au corps sous l'élément avec l'id "demo".

Cela a fonctionné pour moi!

Questions connexes