ajax异步同步加载PHP代码,通过php+JQuery+Ajax简单实现页面异步刷新的代码案例

页面显示如下：

JQueryAjax.html中的代码如下(用的较为简单的$.post)

JQueryAjax+PHP

用户名:

密码:

ajax提交

$(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);

})

})

})

ajax.php：ajax.php

echo '用户名:',$_POST['name'],',密码：',$_POST['pwd']."
";

//这里可以进行一些操作，比如数据库交互

echo "操作完毕";

?>

在非json格式下，后台只能返回字符串，如果想后台返回数组，可以采用json格式

例如将JQueryAjax中的代码修改为如下形式：

JQueryAjax+PHP

用户名:

密码:

ajax提交

$(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){//如果调用php成功

alert(status);

alert(data);

$('.con').html("用户名:"+data[0]+"密码:"+data[1]);

}

});

})

})

ajax.php<?php

$name = $_POST['name'];

$pwd = $_POST['pwd'];

$array = array("$name","$pwd");

//这里进行一个些操作，比如数据库交互

echo json_encode($array);//json_encode方式是必须的

?>

运行效果如下：

本文讲解了通过php+JQuery+Ajax简单实现页面异步刷新的代码案例，更多相关内容请关注Gxl网。

相关推荐：

thinkphp+redis+队列相关问题

在服务器上搭建一个lamp(Linux(CentOS7)+Apache+MySQL+PHP)

Android+PHP+MYSQL开发简单实例的讲解