用jquery和php实现ajax异步请求响应

ajax技术可以实现异步请求和响应,下面的是用jquery向一个php脚本发送异步请求,并得到响应。

第一步,准备好前台的html表单,和jquery实现的ajax请求

 <html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>ajax</title>
<script src="jquery.js"></script>
</head>
<body>
<form>
<input type="text" name="user_name"/>
<a href="javascript:">提交</a>
</form>
<script>
$(function(){
$('a').click(function(){
$.ajax(
{
type : 'post',
url : 'test.php',
dataType : 'json',
data : {
user_name : $('[name="user_name"]').val()
},
success : function(response){
if(response.res){
console.log( response.info );
}else{
console.log( response.info );
}
},
error : function(){
console.log('ajax请求失败!');
}
}
);
});
});
</script>
</body>
</html>

第二步,准备好响应的php脚本

 <?php
if($_POST){
$arr = [
'res' => '',
'info' => ''
];
$arr['res'] = true;
$arr['info'] = $_POST['user_name'];
echo json_encode($arr);
}

第三步,将两个文件,放在服务器里,访问test.html,在表单输入数据,点击,提交,可以在浏览器的控制台中查看到,输出结果,到network,可以查看请求和响应。

用jquery和php实现ajax异步请求响应

上一篇:Jsoup-解析HTML工具(简单爬虫工具)


下一篇:thinkphp3.2.3之自动完成的实现