<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>demojson</title>
</head>
<body>
<h1>员工查询</h1>
<label>请输入员工工号</label>
<input type="text" id="keyWord"></br>
<button id="search">查询</button>
<p id="searchResult"></p>
<h1>员工保存</h1>
<lable>请输入员工姓名</lable>
<input type="text" id="stuffName"></br>
<lable>请输入员工工号</lable>
<input type="text" id="stuffNumber"></br>
<label>请输入员工职位</label>
<input type="text" id="stuffJob"></br>
<lable>请选择员工性别</lable>
<select id="stuffSex">
<option>男</option>
<option>女</option>
</select></br>
<button id="save">保存</button>
<p id="saveResult"></p>
<script>
document.getElementById('search').onclick=function(){
var request = new XMLHttpRequest();
request.open("GET", "serverjson.php?number=" + document.getElementById("keyWord").value);
request.send();
request.onreadystatechange=function(){
if(request.readyState===4){
if(request.status===200){
var data = JSON.parse(request.responseText);
if(data.success){//判断请求是否成功
document.getElementById('searchResult').innerHTML = data.msg;
}
}else{
document.getElementById('searchResult').innerHTML = '错误'+datamsg;
}
}
}
}
document.getElementById('save').onclick=function(){
var request = new XMLHttpRequest();
request.open('post','serverjson.php');
var data='name='+document.getElementById('stuffName').value
+ '&number='+document.getElementById('stuffNumber').value
+ '&sex='+document.getElementById('stuffSex').value
+ '&job='+document.getElementById('stuffJob').value
request.setRequestHeader('content-type','application/x-www-form-urlencoded');
request.send(data);
request.onreadystatechange=function(){
if(request.readyState===4){
if(request.status===200){
var data = JSON.parse(request.responseText);
if(data.success){
document.getElementById('saveResult').innerHTML = data.msg;
}
}else{
document.getElementById('saveResult').innerHTML = '错误'+ data.msg;
}
}
}
}
</script>
</body>
</html>