这篇文章主要为大家详细介绍了php+jquery+ajax实现页面异步刷新,,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
具体如下:
JQueryAjax.html中的代码如下(用的较为简单的$.post)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | < html >
< head >
< meta charset = "UTF-8" >
< title >JQueryAjax+PHP</ title >
< script type = "text/javascript" src = "https://code.jquery.com/jquery-3.0.0.min.js" ></ script >
</ head >
< body >
用户名:< input type = "text" id = "username" name = "username" />< br >
密码:< input type = "password" id = "password" name = "password" />< br >
< button type = "button" class = "butn" >ajax提交</ button >< br >
< span class = "con" ></ span >
< script type = "text/javascript" >
$(document).ready(function(){
$(".butn").click(function(){
var username = $("#username").val();
var password = $("#password").val();
$.post('ajax.php',{name:username,pwd:password},function(data) {
alert(data);
$(".con").html(data);
})
})
})
</ script >
</ body >
</ html >
|
登录后复制
ajax.php
立即学习“PHP免费学习笔记(深入)”;
1 2 3 4 5 6 7 | <?php
echo '用户名:' , $_POST [ 'name' ], ',密码:' , $_POST [ 'pwd' ]. "<br>" ;
echo "操作完毕" ;
?>
|
登录后复制
在非json格式下,后台只能返回字符串,如果想后台返回数组,可以采用json格式
例如将JQueryAjax中的代码修改为如下形式:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | <html>
<head>
<meta charset= "UTF-8" >
<title>JQueryAjax+PHP</title>
<script type= "text/javascript" src= "https://code.jquery.com/jquery-3.0.0.min.js" ></script>
</head>
<body>
用户名:<input type= "text" id= "username" name= "username" /><br>
密码:<input type= "password" id= "password" name= "password" /><br>
<button type= "button" class = "butn" >ajax提交</button><br>
<span class = "con" ></span>
<script type= "text/javascript" >
$(document).ready( function (){
$( ".butn" ).click( function (){
var username = $( "#username" ).val();
var password = $( "#password" ).val();
$.ajax({
url: "ajax.php" ,
type: "POST" ,
data:{name:username,pwd:password},
dataType: "json" ,
error: function (){
alert( 'Error loading XML document' );
},
success: function (data,status){
alert(status);
alert(data);
$( '.con' ).html( "用户名:" +data[0]+ "密码:" +data[1]);
}
});
})
})
</script>
</body>
</html>
|
登录后复制
ajax.php
1 2 3 4 5 6 7 8 | <?php
$name = $_POST [ 'name' ];
$pwd = $_POST [ 'pwd' ];
$array = array ( "$name" , "$pwd" );
echo json_encode( $array );
?>
|
登录后复制
总结:以上就是本篇文的全部内容,希望能对大家的学习有所帮助。
相关推荐:
PHP面向对象继承用法详解
php图像处理函数imagecopyresampled的用法
php die()与exit()的区别实例详解
以上就是php+jQuery+Ajax实现页面异步刷新功能的详细内容,更多请关注php中文网其它相关文章!