前端通过AJAX提交数据，后台PHP处理数据实现异步操作基本流程

前端发送数据到后端，一是通过form表单来进行提交数据，还有一种是通过ajax来提交数据。这里我简单说一下如何使用ajax来发送数据：

ajax：异步的JavaScript和xml的简称。通过ajax可以实现在当前页面直接提交数据到后台服务器，并且局部更新UI。

这里我采用的是jquery封装的ajax。jquery封装的ajax主要有三种，分别是:$.ajax()，$.get()，$.post()三个函数。第一个函数是后面两个的综合。

我们知道，表单提交的方式有两种，分别是get和post，所以当我们使用第一个函数来发送ajax请求的时候，需要指定type，是get还是post，后两个函数则是使用get还是pos方式提交。

这里我用$.post()函数来做简单的例子：

html代码：

<input type="text" id="username">
<input type="password" id="password">
<input type="button" value="提交" id="subBtn">

这里有两个输入框和一个按钮，注意的是，这里的按钮不能是submit。

js代码（请自行引入jquery类库）：

$("#subBtn").click(function(){//按钮单击

  //获取用户名框和密码框的值

var oUsername = $("#username").val(); var oPassword = $("#password").val();

  //发送的数据：json格式，{key:value}
  var con = {username:oUsername,password:oPassword};

  //三个参数：发送到的后台地址，数据，发送成功后的回调函数
  $.post("test.php",con,function(data){
    var result = JSON.parse(data);

    alert(result.message);
  });
});

后台PHP代码：

$username = $_POST["username"];//获取username的值
$password = $_POST["password"];//获取password的值
$result = (Object)null;//返回结果对象
$result -> message = "用户名：{$username},密码：{$password}";//返回信息
echo json_encode($result);//将返回结果转为json

基本流程就这样子，前端输入用户名和密码，点击按钮，获取值，组装json，然后发送到后台，后台获取到结果，返回一个json对象，前端再成功的回调函数里解析json，将服务器返回的结果alert出来。