//server.php 服务端代码 <?php header("Content-Type:text/plain;charset=utf-8"); //多维数组 $staff = array (
//server.php 服务端代码
<?php
header("Content-Type:text/plain;charset=utf-8");
//多维数组
$staff = array (
array("name" => "wanguanna","number" => "1","sex" =>"男","job" => "总经理"),
array("name" => "wanguanna","number" => "2","sex" =>"男","job" => "付经理"),
array("name" => "wanguanna","number" => "3","sex" =>"女","job" => "员工")
);
//请求的判断,$_超全局变量的开头,不适用global关键字
if($_SERVER['REQUEST_METHOD'] == 'GET'){
search();
}else if($_SERVER['REQUEST_METHOD'] =='POST'){
create();
}
//检查是否有员工编号的参数
function search(){
if(!isset($_GET['number']) || empty($_GET['number'])){
echo "参数错误";
return;
}
global $staff;
//获取number参数
$number = $_GET['number'];
$result = "没有找到员工";
//遍历$staff多维数组,查找key值为number的员工是否存在
foreach($staff as $value){
if($value["number"] == $number){
$result = "找到员工:员工编号:".$value["number"].",员工姓名:".$value["name"].",员工性别:".$value["sex"].",员工职位:".$value["job"];
break;
}
}
echo $result;
}
//创建员工
function create(){
//判断信息是否填写完成
if(!isset($_POST["name"]) || empty($_POST["name"]) ||
!isset($_POST["number"]) || empty($_POST["number"]) ||
!isset($_POST["sex"]) || empty($_POST["sex"]) ||
!isset($_POST["job"]) || empty($_POST["job"])
){
echo "参数错误,员工信息填写不全";
return;
}
echo "员工:".$_POST["name"]."信息保存成功";
}
?>
//客户端html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<body>
<h1>员工查询</h1>
<label>请输入员工编号</label>
<input type="text" id="keyword">
<button id="search">查询</button>
<p id="searchResult"></p>
<h1>添加员工</h1>
<label>请输入员工姓名</label>
<input type="text" id="name"><br/>
<label>请输入员工编号</label>
<input type="text" id="number"><br/>
<label>请输入员工性别</label>
<select id="sex"><br/>
<option>
男
</option>
<option>
女
</option>
</select><br/>
<label>请输入员工职位</label>
<input type="text" id="job"><br/>
<button id="save">添加</button><br/>
<p id="createResult"></p>
<script>
//查询请求绑定事件
document.getElementById("search").onclick = function(){
//发送查询请求并处理
var request = new XMLHttpRequest();
request.open("GET","server.php?number="+document.getElementById("keyword").value);
request.send();
request.onreadystatechange = function(){
if(request.readyState === 4){
if(request.status === 200){
document.getElementById("searchResult").innerHTML = request.responseText;
}else{
alert("发生错误"+request.status);
}
}
}
}
//添加请求绑定事件
document.getElementById("save").onclick = function(){
var request = new XMLHttpRequest();
request.open("POST","server.php");
var data = "name="+document.getElementById("name").value+"&number="+document.getElementById("number").value+"&sex="+document.getElementById("sex").value+"&job="+document.getElementById("job").value;
//必须要设置setRequestHeader()方法,否则不成功
request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
request.send(data);
request.onreadystatechange = function(){
if(request.readyState === 4){
if(request.status === 200){
document.getElementById("createResult").innerHTML = request.responseText;
}else{
alert("发生错误"+request.status);
}
}
}
}
</script>
</body>
</html>