取消上次的ajax请求 ajax.abort();原理所有ajax方法都会返回一个XMLHttpRequest对象
ajaxabort.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jQuery.get()</title>
<style type="text/css">
ul{border:1px solid black;list-style:none;
margin:0pt;padding:0pt;float:left;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;width:300px;}
li{padding:10px 5px;border-bottom:1px solid black;}
</style>
</head>
<body>
<form>
<p>
Show list of:
<select id="choice">
<option value="">select</option>
<option value="good">Good Guys</option>
<option value="bad">Bad Guys</option>
</select>
</p>
<p id="result"></p>
</form>
<script type="text/javascript" src="../jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var ajax;
$("#choice").change(function(){
if(ajax){
ajax.abort();
}
ajax= $.get('abortajax.php',
{what:$(this).val()},
function(data){
$('#result').html(data);
}
);
});
});
</script>
</body>
</html>
ajaxabort.php
<?php
sleep(10);
if($_GET['what']=='good'){
$names=array('a','b','c','d');
echo getHTML($names);
}else if($_GET['what']=='bad'){
$names=array('c','d','e','f');
echo getHTML($names);
}
function getHTML($names){
$strResult='<ul>';
for($i=0;$i<count($names);$i++){
$strResult.='<li>'.$names[$i].'</li>';
}
$strResult.='</ul>';
return $strResult;
}
sleep(10);
if($_GET['what']=='good'){
$names=array('a','b','c','d');
echo getHTML($names);
}else if($_GET['what']=='bad'){
$names=array('c','d','e','f');
echo getHTML($names);
}
function getHTML($names){
$strResult='<ul>';
for($i=0;$i<count($names);$i++){
$strResult.='<li>'.$names[$i].'</li>';
}
$strResult.='</ul>';
return $strResult;
}
浙公网安备 33010602011771号