2013-08-30 219 views
0

這是我的代碼,它具有自動填充地址和識別所選緯度/經度/地址的功能。

<html> 

<head> 
<LINK rel="stylesheet" type="text/css" href="style.css"> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script> 
</head> 

<body> 
<p>Location: <input type="text" id="searchTextField" size="50" placeholder="Where do you want to go ?"/></p> 

<div id="results"></div> 

<script> 


var input = document.getElementById('searchTextField'); 
var options = { 

}; 
var autocomplete = new google.maps.places.Autocomplete(input,options); 
//autocomplete.bindTo('bounds', map); 

google.maps.event.addListener(autocomplete, 'place_changed', function() { 
    $("#results").html(''); 
    var place = autocomplete.getPlace(); 
    $("#results").append('<p> Latitude and Longtidute : '+place.geometry.location +'</p>'); 
    $("#results").append('<p> Address : '+place.formatted_address +'</p>'); 
    $("#results").append('<p> Places Name : '+place.name+'</p>'); 

    var searchAddressComponents = place.address_components; 
    $.each(searchAddressComponents, function(){ 
    if(this.types[0]=="postal_code"){ 
     searchCountry=this.short_name; 
    } 
}); 
}); 
</script> 
</body> 
</html> 

我以爲一切都是正確的,但它在Firebug的ReferenceError引發此錯誤:$未定義

可以請你幫我一下吧

請參考檢查http://jsfiddle.net/NuCUd/8/

+0

負荷的jquery.js。 – Omar

+0

您從未定義'$',並且您從未包含可定義它的腳本。 –

+0

你從哪裏得到這樣的信息? **你的小提琴似乎並沒有拋出那個錯誤。 – acdcjunior

回答

3

你的代碼更改爲:

<html> 

<head> 
<LINK rel="stylesheet" type="text/css" href="style.css"> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script> 
</head> 

<body> 
<p>Location: <input type="text" id="searchTextField" size="50" placeholder="Where do you want to go ?"/></p> 

<div id="results"></div> 

<script> 


var input = document.getElementById('searchTextField'); 
var options = { 

}; 
var autocomplete = new google.maps.places.Autocomplete(input,options); 
//autocomplete.bindTo('bounds', map); 

google.maps.event.addListener(autocomplete, 'place_changed', function() { 
    $("#results").html(''); 
    var place = autocomplete.getPlace(); 
    $("#results").append('<p> Latitude and Longtidute : '+place.geometry.location +'</p>'); 
    $("#results").append('<p> Address : '+place.formatted_address +'</p>'); 
    $("#results").append('<p> Places Name : '+place.name+'</p>'); 

    var searchAddressComponents = place.address_components; 
    $.each(searchAddressComponents, function(){ 
    if(this.types[0]=="postal_code"){ 
     searchCountry=this.short_name; 
    } 
}); 
}); 
</script> 
</body> 
</html> 
5

$由jQuery定義,這是一個普通的第三方庫。

如果您不包含它,它將不存在。

0

小提琴在其中加載了jQuery。你的例子沒有。