在我的距离/速率计算器中（对于我使用谷歌地图的距离），我实现了AJAX，我得到了错误的白色屏幕。
<?
session_start();
ob_start();
require_once("patch/require.php");
function curl_request($sURL,$sQueryString=null)
{
$cURL=curl_init();
curl_setopt($cURL,CURLOPT_URL,$sURL.'?'.$sQueryString);
curl_setopt($cURL,CURLOPT_RETURNTRANSFER, TRUE);
$cResponse=trim(curl_exec($cURL));
curl_close($cURL);
return $cResponse;
}
if(isset($_POST))
{
$dest= str_replace(',','',str_replace(' ','+',trim($_POST['to'])));
$origin =str_replace(',','',str_replace(' ','+',trim($_POST['from'])));
$sResponse=curl_request('http://maps.googleapis.com/maps/api/distancematrix/json','origins='.$origin.'&destinations='.$dest.'&mode=driving&units=metric&sensor=false');
$oJSON=json_decode($sResponse);
if ($oJSON->status=='OK')
$fDistanceInKM=(float)preg_replace('/[^'d'.]/','',$oJSON->rows[0]->elements[0]->distance->text);
else
$fDistanceInKM=0;
$oJSON->destination_addresses[0];
$oJSON->origin_addresses[0];
if(!isset($_SESSION['getTravel']))
{
$_SESSION['getTravel']=time();
}
$session_id=$_SESSION['getTravel'];
$origin=mysql_real_escape_string($oJSON->origin_addresses[0]);
$destination=mysql_real_escape_string($oJSON->destination_addresses[0]);
$distance=mysql_real_escape_string($fDistanceInKM.PHP_EOL);
$increase=(int)$_POST['inc'];
$checkQ=mysql_query("select * from temp_travel where `session_id`='$session_id'")or die(mysql_error());
$cms_distance_lower=number_format(Functions::getConf(3113),2);
$cms_distance_upper=number_format(Functions::getConf(3116),2);
$cms_lower_price=number_format(Functions::getConf(3111),2);
$cms_between_price=number_format(Functions::getConf(3112),2);
$cms_upper_price=number_format(Functions::getConf(3117),2);
$cms_bag_price=number_format(Functions::getConf(3114),2);
$cms_handcarry_price=number_format(Functions::getConf(3115),2);
$distance=(int)$distance;
if($distance<=$cms_distance_lower)
{
$pr=$cms_lower_price;
}
else if($distance>$cms_distance_lower && $distance<=$cms_distance_upper)
{
$pr=$cms_between_price;
}
else
{
$pr=$distance*$cms_upper_price;
}
if(mysql_num_rows($checkQ)>0)
{
$check=mysql_fetch_array($checkQ);
$check_id=(int)$check['Id'];
$passenger=$check['passenger'];
if($passenger<4)
{
$hd=3;
$bg=3;
}
else
{
$pr+=($passenger-3)*8;
if($passenger<6 )
{
$hd=3;
}
else
{
$hd=$passenger-2;
}
$bg=$passenger;
}
$handcarry=$check['handcarry'];
$baggage=$check['baggage'];
$price=number_format($pr+($cms_handcarry_price*($handcarry))+($cms_bag_price*($baggage))+$check['increase'],2);
mysql_query("update temp_travel set `origin`='$origin',`destination`='$destination',`distance`='$distance',`increase`='$increase',`price`='$price' where `Id`='$check_id'")or die(mysql_error());
}
else
{
$price=number_format(($pr+$increase),2);
mysql_query("insert into temp_travel (`session_id`,`origin`,`destination`,`distance`,`increase`,`price`,`handcarry`,`baggage`) values ('$session_id','$origin','$destination','$distance','$increase','$price','','')")or die(mysql_error());
}
}
include('infotable.php');
?>
我将此页面的响应保存在ajax调用的getValue中，但却出现了有问题的错误。当我提交请求时，一个空白的白色页面出现了，它什么也没做；不知道原因：
端口错误：无法建立连接。接收端不存在。
转到此链接http://www.airporttaxibooking.ca/并检查RateCalculator。
这是我发送请求的.js文件：
$('#ptext').focus(function () { $('input:text[name=pearson-code]').val(''); });
$('#ptext').blur(function () {
if($('input:text[name=pearson-code]').val()!='')
{
$('input:text[name=tpearson-code]').val('');
$('.ptext').attr('disabled','true');
var from= $('input:text[name=pearson-code]').val();
var inc=$('input:radio[name=pdestination]:checked').val();
var to ="Mississauga, ON L4W 1S9, Canada";
var data='from='+from+'&inc='+inc+'&to='+to;
$.ajax({
type: "POST",
url: "distance.php",
data: data,
success: function(getValue) {
$('#cbox-2').html(getValue);
}
});
$('.ptext').removeAttr('disabled','true');
}
return false;
});
这是infotable.php文件：
<?
include("patch/require.php");
if(isset($_SESSION['getTravel']))
{
$session_id=$_SESSION['getTravel'];
$travel_infoQ=mysql_query("select * from temp_travel where `session_id`='$session_id'")or die(mysql_error());
if(mysql_num_rows($travel_infoQ)>0)
{
$travel_info=mysql_fetch_array($travel_infoQ);
$destination=stripslashes($travel_info['destination']);
$origin=stripslashes($travel_info['origin']);
$distance=stripslashes($travel_info['distance']);
$passenger=stripslashes($travel_info['passenger']);
$handcarry=stripslashes($travel_info['handcarry']);
$baggage=stripslashes($travel_info['baggage']);
$increase=stripslashes($travel_info['increase']);
$cms_distance_lower=Functions::getConf(3113);
$cms_distance_upper=Functions::getConf(3116);
$cms_lower_price=Functions::getConf(3111);
$cms_between_price=Functions::getConf(3112);
$cms_upper_price=Functions::getConf(3117);
$cms_bag_price=Functions::getConf(3114);
$cms_handcarry_price=Functions::getConf(3115);
$distance=(int)$distance;
if($distance<=$cms_distance_lower)
{
$pr=$cms_lower_price;
}
else if($distance>$cms_distance_lower && $distance<=$cms_distance_upper)
{
$pr=$cms_between_price;
}
else
{
$pr=$distance*$cms_upper_price;
}
if($passenger<4)
{
$hd=3;
$bg=3;
}
else
{
$pr+=($passenger-3)*8;
if($passenger<6 )
{
$hd=3;
}
else
{
$hd=$passenger-2;
}
$bg=$passenger;
}
$price=$pr+$cms_handcarry_price*($handcarry)+$cms_bag_price*($baggage)+$increase;
mysql_query("update temp_travel set `price`='$price' where `session_id`='$session_id'");
}
}
?>
<table border="0" width="100%" cellpadding="0" style="margin:0px; padding:0px;" cellspacing="0">
<tr>
<td class="td" valign="top" width="35%" ><strong>From :</strong></td>
<td class="td" valign="top"><? echo $destination; ?></td>
</tr>
<tr>
<td class="td" valign="top"><strong>To :</strong> </td>
<td class="td" valign="top"><? echo $origin; ?></td>
</tr>
<tr>
<td class="td" valign="top"><strong>Passengers :</strong> </td>
<td class="td" valign="top"><div id="passenger"><? echo $passenger; ?></div></td>
</tr>
<tr>
<td class="td" colspan="2" style="text-align:center; background:#ffffff;" valign="top"><strong>Number of Baggages</strong> </td>
</tr>
<tr>
<td class="td" valign="top"><strong>Large Baggages :</strong> </td>
<td class="td" valign="top"><? if(!empty($baggage)){ echo '<div id="luggage2">'.$bg.'</div> <div id="baggage"> + '. $baggage.'</div>'; }else { echo $bg; } ?></td>
</tr>
<tr>
<td class="td" valign="top"><strong>Hand Carries :</strong> </td>
<td class="td" valign="top"><? if(!empty($handcarry)){ echo '<div id="luggage1">'.$hd.'</div> + <div id="baggage">'. $handcarry.'</div>';}else { echo $hd; } ?></td>
</tr>
<tr>
<td class="td" style="text-align:center" colspan="2"><strong >Price : $<div id="price"><? echo $price ?></div></strong></td>
</tr>
<tr>
<td class="td" colspan="2" style="text-align:center;" align="center"><button id="button" onclick="document.location='<?=_WEB_URL?>bookingform.php'">Book Now</button></td>
</tr>
</table>
您遇到了几个问题。您的直接错误是，当您键入邮政编码"123"并单击"刷新"时，AJAX操作会启动，但您没有阻止事件冒泡到默认操作，即将表单提交到另一个页面。因此，AJAX操作经常（但并不总是）终止，因为它的父页面正在被重新加载——这取决于哪个先加载。（如果事件处理程序中存在JavaScript错误，也可能发生这种情况）。
还有一些JS错误与单击单选按钮有关。你在使用开发者工具栏吗？Safari和Chrome本身就有一个插件，Firefox也有出色的Firebug插件。这是AJAX调试工具包中必不可少的部分，应该在屏幕上显示所有类似的内容。
我注意到，如果在AJAX请求之外查看，您的AJAX URL（这个GET和这个POST）会呈现整个页面。这使得单独测试变得更加困难——您应该能够在单独的浏览器窗口中加载这些测试，并获得JSON答案。最后，除非POST操作更改了服务器上的某些内容，否则也应该是GET操作。