index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <Meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Ajax</title> <script type="text/javascript" src="jquery-1.10.1.js"></script> <script type="text/javascript" src="demo.js"></script> <link type="text/css" rel="stylesheet" href="style.css" /> </head> <body> <form> 用户名:<input type="text" name="user" /> 邮件:<input type="text" name="email" /> <input type="radio" name="sex" value="男" />男 <input type="radio" name="sex" value="女" />女 <input type="button" value="提交" /> </form> <span class="loading">正在加载中...</span> <div id="Box"></div> </body> </html>
style.css
/* CSS Document */
.loading{display: none; color: #c00; font-weight: bold;}
user.PHP
<?PHP echo $_POST['user'].'-'.$_POST['email'] ?>
test.json
[
{
"url":"www.onestopweb.cn"
}
]
jsonp.PHP
<?PHP
$_arr = array('a'=>1,'b'=>2,'c'=>3);
$_result = json_encode($_arr);
echo $_result;
?>
test1.PHP
<?PHP echo 'test1.PHP'; ?>
test2.PHP
<?PHP echo 'test2.PHP'; ?>
demo.js
$(function(){
/*
$('form input[type=button]').click(function(){
$.ajax({
type:'POST',url:'test.json',success:function(response,status,xhr){
alert(response[0].url);
}
});
});
$('form input[type=button]').click(function(){
$.ajax({
type:'POST',dataType:'html',xhr){
alert(response);
}
});
});
//本地获取 jsonp.PHP 文件,成功
$('form input[type=button]').click(function(){
$.ajax({
type:'POST',url:'jsonp.PHP',dataType:'json',xhr){
alert(response);
alert(response.a);
}
});
});
$('form input[type=button]').click(function(){
$.ajax({
type:'POST',url:'user.PHP',data:$('form').serialize(),//只能显示第二个
success:function(response,xhr){
alert(response +'1');
},xhr){
alert(response+'2');
}
});
});
//jqXHR 就是 $.ajax() 返回的对象
$('form input[type=button]').click(function(){
var jqXHR = $.ajax({
type:'POST',data:$('form').serialize()
});
jqXHR.success(function(response){
alert(response);
});
});
//jqXHR 就是 $.ajax() 返回的对象
$('form input[type=button]').click(function(){
var jqXHR = $.ajax({
type:'POST',data:$('form').serialize()
});
// jqXHR.success(function(response){
// alert(response);
// });
jqXHR.done(function(response){
alert(response +'1');
}).done(function(response){
alert(response +'2');
});
jqXHR.done(function(response){
alert(response +'3');
});
});
//jqXHR 就是 $.ajax() 返回的对象
$('form input[type=button]').click(function(){
var jqXHR1 = $.ajax('test1.PHP');
var jqXHR2 = $.ajax('test2.PHP');
jqXHR1.done(function(response){
alert(response);
});
jqXHR2.done(function(response){
alert(response);
});
});
//jqXHR 就是 $.ajax() 返回的对象
$('form input[type=button]').click(function(){
var jqXHR1 = $.ajax('test1.PHP');
var jqXHR2 = $.ajax('test2.PHP');
$.when(jqXHR1,jqXHR2).done(function(r1,r2){
alert(r1[0]);
alert(r2[0]);
});
});
*/
});