ajax基本语法$.ajax({
type: "post", //数据的提交方式(post\get)
url: "text.php", //提交的url地址
data: {name:name,pwd:pwd},//需要提交的数据
dataType: "json",//返回的数据类型格式
success: function(msg){ //返回成功的回调函数
},
error:function(msg){ //返回失败的回调函数
}
});
php端的接收方法<?php
$name=$_POST['name'];//接收post方式提交过来的name数据
$pwd=$_POST['pwd'];?>
html端代码text.htmlhtml>
ajaxTest查询
php端代码text.php<?php
header('Content-type:text/json;charset=utf-8'); $name=$_POST['name']; $pwd=$_POST['pwd']; $data='{name:"' . $name . '",pwd:"' . $pwd .'"}';//组合成json格式数据
echo json_encode($data);//输出json数据123456
在text.html中加入以下js代码
$(function(){
$('#sub').click(function(){
var name=$('#name').val(); var pwd=$('#pwd').val();
$.ajax({
type: "post",
url: "text.php",
data: {name:name,pwd:pwd},//提交到text.php的数据
dataType: "json",//回调函数接收数据的数据格式
success: function(msg){
$('#text').empty(); //清空Text里面的所有内容
var data=''; if(msg!=''){
data = eval("("+msg+")"); //将返回的json数据进行解析,并赋给data
}
$('#text').html("用户名为:" + data.name + ",密码为:" + data.pwd); //在#text中输出
console.log(data); //控制台输出
},
error:function(msg){
console.log(msg);
}
});
});
})