ajax-php实例

最新推荐文章于 2021-03-29 16:43:31 发布

翻译最新推荐文章于 2021-03-29 16:43:31 发布 · 372 阅读

文章标签：

本文介绍了一个简单的登录注册界面与后台服务器通过AJAX进行数据交换的过程。前端收集用户输入的信息，如姓名、年龄和性别，通过AJAX以JSON格式发送至后台PHP服务器。服务器接收并处理数据，再将处理后的数据以JSON格式返回前端，最终展示在注册结果框中。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

简易登录界面与后台服务器连接，在这里，我们模拟service.php为后台服务器。
功能实现：在登录界面中输入姓名年龄和性别，点击注册按钮，信息传回服务器，再将输入的信息显示在“注册结果”的显示框中。
实现图片：
在这里插入图片描述
注意：在ajax中是以对象的格式传入php，在php中以json的形式传回页面。
1.将输入框中获取到的信息包裹成对象：

var name = $("#yourName").val();
var age = $("#yourAge").val();
var sex = $("#yourSex").val();

var info ={
	'name':name,
	'age':age,
	'sex':sex
	};

2.在ajax中传回后端的数据名为info，datatype是后端传回前端的数据类型，

 $.ajax({
	   type:"post",
       url:"serve.php",
       data:info,
       dataType:"json",  
       success:function(msg){
           $("#result").append("恭喜！注册成功！"+
           "你的名字是"+msg.name+"，性别："+
           msg.sex+"，年龄："+msg.age);
                    }
                });

3.在php中将接受到的对象拆分为单个数据，便于组成数组。

	$username = $_POST['name'];
    $userage = $_POST['age'];
    $usersex = $_POST['sex'];

    // 拼成一个数组类型
    $json_array = array('name'=>$username,'age'=>$userage,'sex'=>$usersex);

4.再将数组转换成json对象传回前端

 // 将数组类型转换成json对象
    $json = json_encode($json_array);
    echo $json;

另一种写法：

  $data='{username:"' . $username . '",password:"' . $password .'"}';
  //组合成json格式数据
  echo json_encode($data);//输出json数据

其中，ajax传入的data如果写成

data:"name=wanger&age=22&sex=女",

这种格式，输出的内容就是固定的。