功能未定义 [英] Function not defined
问题描述
JQuery代码：
http：// maps .google.com / maps？file = api& v = 2& key = ABQIAAAAhTrgZ5jvdqcEQouEpPcZ_hS81NmJwGXlxuJr8lEEo4Njw3WRVhT8auzZb55JSMDkwIaCdNkPHL5gNgtype =text / javascript>
< script type =text / javascript>
$（document）.ready（function（）{
var dealerName = $（'。name'，'.adr'）。text ）;
var customerName = dealerName.slice（0， - 1）;
var customerAddress = $（'。street'，'.adr'）。text（）+'，'+ $（' （'。'''''。''）。text（）+'，'+'（'。state'，'.adr'）。text ）.text（）;
$（＃nameAddress .placeholderName）。html（customerName）;
$（＃nameAddress .placeholderAddress）。html（customerAddress）;
var error_address_empty ='请先输入一个有效的地址';
var error_invalid_address ='这个地址是请确保输入您的街道号码和城市？';
var error_google_error ='处理您的请求时出现问题，请再试一次。';
var error_no_map_info ='对不起！地图信息不适用于此地址。';
var default_address = customerAddress;
var current_address = null;
var map = null;
var geocoder = null;
var gdir = null;
var map_compatible = false;
if（GBrowserIsCompatible（））{
map_compatible = true;
函数initialize_map（）{
if（map_compatible）{
map = new GMap2（document.getElementById（'map_canvas'））;
geocoder = new GClientGeocoder（）;
show_address（default_address）;
map.addControl（new GSmallMapControl（））;
map.addControl（new GMapTypeControl（））;
函数show_address（地址）{
if（map_compatible& geocoder）{
current_address = address;
geocoder.getLatLng（
地址，
函数（点）{
if（！point）{
alert（error_no_map_info）;
} else {
map.setCenter（point，13）;
var marker = new GMarker（point）;
map.addOverlay（marker）;
marker.openInfoWindowHtml（< span style = 'font-weight：bold;'>+ customerName +< br />< / span>< span style ='font-size：12px;'>+ address +< / span>）;
}
}
）;
}
返回false;
函数get_directions（）{
if（map_compatible）{
if（document.direction_form.from_address.value ==''）{
警报（error_address_empty）;
返回false;
}
document.getElementById（'directions'）。innerHTML ='';
gdir = new GDirections（map，document.getElementById（'directions'））;
GEvent.addListener（gdir，'error'，handleErrors）;
set_directions（document.direction_form.from_address.value，current_address）;
}
返回false;
函数set_directions（fromAddress，toAddress）{
gdir.load（from：+ fromAddress +to：+ toAddress，
{locale ：en}）;
函数handleErrors（）{
if（gdir.getStatus（）。code == G_GEO_UNKNOWN_ADDRESS）
alert（error_invalid_address）;
else if（gdir.getStatus（）。code == G_GEO_SERVER_ERROR）
alert（error_google_error）;
else if（gdir.getStatus（）。code == G_GEO_MISSING_QUERY）
alert（error_address_empty）;
else
alert（error_invalid_address）;
}
$（window）.load（initialize_map）;
}）;
< / script>
来自HTML网页的代码：
< div id =main-map-wrapper>
< div id =seperator>< / div>
< table width =100％height =94>
< tr valign =top>
< td width =33％colspan =3>
< div id =headertextdiv>
< div id =nameAddress>
< span class =placeholderNamestyle =font-size：20px; font-weight：bold; line-height：22px;>& nbsp;& nbsp;< / span>
< br />
< span class =placeholderAddressstyle =font-size：14px; font-weight：bold; line-height：22px;>& nbsp;& nbsp;< / span>
< br />
< input type =submitonClick =return show_address（'5930 West Plano Pkwy，Plano，Texas，75093'）; value =经销商中心地图>
< / div>
< / div>
< / td>
< / tr>
< / table>
< div id =map_canvas>& nbsp;& nbsp;< / div>
< form name =direction_formonSubmit =get_directions（）; return false;类= 形式 >
< span style =font-size：18px; font-weight：bold;>需要指示？< / span>
< br />
< br />
< input type =textname =from_addressclass =form-field/>
< input type =submitvalue =Get Directionsclass =form-submitstyle =margin-left：10px; />
< / form>
< a name =directions_table>& nbsp;& nbsp;< / a>
< div id =directions>& nbsp;& nbsp;< / div>
< / div>
< div class =footer-fix>& nbsp;& nbsp;< / div>
问题：
无论如何，正如你在代码中看到的，我首先设置了所有的变量（包括customerName和customerAddress，在这种情况下是最重要的）。然后，我有四个函数，并在脚本结束时初始化地图。除了html页面上的两件事外，所有东西都可以工作。有一个onClick来中心地图不工作和表单提交不起作用。
我相信这是因为我有函数设置在 ready 处理程序。我被告知我需要将函数绑定到它的处理程序中，就像我使用initialize_map一样。我试图做到这一点，但我尝试的一切都不起作用。附注和有用的提示可能是： show_address 在我调用 initialize_map 时立即运行以启动地图。然而，当您点击按钮经销商中心地图时，它也应该被调用。 get_directions 仅在您提交表单时调用。
截至目前，当页面加载时，所有内容都显示正确;然而，当我点击经销商中心地图或提交表单时，我得到一个javascript错误，告诉我该函数没有定义。
我在与此停滞不前。不知道如何正确运作。任何帮助是极大的赞赏。感谢！
这是因为您的 show_address 和 get_directions 在 document.ready 处理程序的作用域内定义 only ，如果你需要在外部移动函数想通过内联脚本调用它们。
I am getting a function not defined error with my jquery script and i'm not sure why.
JQuery Code: http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAhTrgZ5jvdqcEQouEpPcZ_hS81NmJwGXlxuJr8lEEo4Njw3WRVhT8auzZb55JSMDkwIaCdNkPHL5gNg" type="text/javascript">
<script type="text/javascript">
$(document).ready(function(){
var dealerName = $('.name', '.adr').text();
var customerName = dealerName.slice(0, - 1);
var customerAddress = $('.street', '.adr').text() + ', ' + $('.locality', '.adr').text() + ', ' + $('.state', '.adr').text() + ', ' + $('.zipCode', '.adr').text();
$("#nameAddress .placeholderName").html(customerName);
$("#nameAddress .placeholderAddress").html(customerAddress);
var error_address_empty = 'Please enter a valid address first.';
var error_invalid_address = 'This address is invalid. Make sure to enter your street number and city as well?';
var error_google_error = 'There was a problem processing your request, please try again.';
var error_no_map_info = 'Sorry! Map information is not available for this address.';
var default_address = customerAddress;
var current_address = null;
var map = null;
var geocoder = null;
var gdir = null;
var map_compatible = false;
if( GBrowserIsCompatible() ) {
map_compatible = true;
}
function initialize_map() {
if( map_compatible ) {
map = new GMap2(document.getElementById('map_canvas'));
geocoder = new GClientGeocoder();
show_address(default_address);
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
}
}
function show_address(address) {
if( map_compatible && geocoder ) {
current_address = address;
geocoder.getLatLng(
address,
function( point ) {
if( !point ) {
alert(error_no_map_info);
} else {
map.setCenter(point, 13);
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml("<span style='font-size:14px; font-weight:bold;'>" + customerName + "<br /></span><span style='font-size:12px;'>" + address + "</span>");
}
}
);
}
return false;
}
function get_directions() {
if( map_compatible ) {
if( document.direction_form.from_address.value == '' ) {
alert(error_address_empty);
return false;
}
document.getElementById('directions').innerHTML = '';
gdir = new GDirections(map, document.getElementById('directions'));
GEvent.addListener(gdir, 'error', handleErrors);
set_directions(document.direction_form.from_address.value, current_address);
}
return false;
}
function set_directions(fromAddress, toAddress) {
gdir.load("from: " + fromAddress + " to: " + toAddress,
{ "locale": "en" });
}
function handleErrors(){
if( gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS )
alert(error_invalid_address);
else if( gdir.getStatus().code == G_GEO_SERVER_ERROR )
alert(error_google_error);
else if( gdir.getStatus().code == G_GEO_MISSING_QUERY )
alert(error_address_empty);
else
alert(error_invalid_address);
}
$(window).load(initialize_map);
});
</script>
Code from the HTML page:
<div id="main-map-wrapper">
<div id="seperator"></div>
<table width="100%" height="94">
<tr valign="top">
<td width="33%" colspan="3">
<div id="headertextdiv">
<div id="nameAddress">
<span class="placeholderName" style="font-size:20px; font-weight:bold; line-height:22px;"> </span>
<br />
<span class="placeholderAddress" style="font-size:14px; font-weight:bold; line-height:22px;"> </span>
<br />
<input type="submit" onClick="return show_address('5930 West Plano Pkwy, Plano, Texas, 75093');" value="Center Map on Dealership">
</div>
</div>
</td>
</tr>
</table>
<div id="map_canvas"> </div>
<form name="direction_form" onSubmit="get_directions(); return false;" class="form">
<span style="font-size:18px; font-weight:bold;">Need directions?</span>
<br />
<span style="font-size:14px; margin-top:7px;">Enter your address below to get turn-by-turn directions:</span>
<br />
<input type="text" name="from_address" class="form-field" />
<input type="submit" value="Get Directions" class="form-submit" style="margin-left:10px;" />
</form>
<a name="directions_table"> </a>
<div id="directions"> </div>
</div>
<div class="footer-fix"> </div>
Problem: Anyway, as you can see in the code i am first setting all of the variables (including the customerName and customerAddress, which are the most important in this case). Then i have four functions and at the end of the script i initialize the map. Everything works except for two things on the html page. There is an "onClick" to center the map that is not working and the form submit does not work.
I believe this is because i have the functions set inside the ready handler. I have been told that i need to bind the functions to their events within that handler just as i have with initialize_map. I have tried to do this but everything i try does not work. Side note and helpful tip maybe: show_address runs immediately to start the map when i call initialize_map; however, it is also what is supposed to be called when you click the button "Center Map on Dealership". get_directions is only called when you submit the form.
As of now everything shows up right when the page loads; however, when i click on "Center map on Dealership" or submit the form i get a javascript error that is telling me that the function is not defined.
I am at a standstill with this. Not sure how to get this functioning properly. Any help is greatly appreciated. Thanks!
It's because your show_address and get_directions are defined only inside that document.ready handler's scope, you need to move the functions outside there if you want to call them via inline script.
这篇关于功能未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
