原生ajax添加和post请求

第一步，先创建展示页面

<table border='1'>
		<tr>
			<td>留言内容</td>
			<td><textarea  id="contents" cols="30" rows="10"></textarea></td>
		</tr>
		<tr>
			<td>留言人</td>
			<td>
			    <select  id="uname">
			    	<option value="猪八戒">猪八戒</option>
			    	<option value="孙悟空">孙悟空</option>
			    	<option value="师傅">师傅</option>
			    	<option value="沙和尚">沙和尚</option>
			    </select>
			</td>
		</tr>
		<tr>
			<td colspan="2"><input type="button" value="留言" onclick="inser()"></td>	
		</tr>
	</table>

第二步，写ajax请求

<script>
	function inser(){
		var uname = document.getElementById("uname").value;
		var contents = document.getElementById("contents").value;
		//1.创建ajax对象
		var ajax = new XMLHttpRequest();
		//2.连接服务器
		ajax.open('post','inser.php',true);
		//3.设置请求头信息
		ajax.setRequestHeader('content-type','application/x-www-form-urlencoded');
		//4.发送请求
		ajax.send('name='+uname+"&contents="+contents);
		/*
		   ajax:接值：
		   1.监听事件：onreadystatechang去监听ajax.readyState什么时候等于4
		   2.判断 ：ajax.readyState==4 ajax.status=200
		   3.接值:ajax.responseText
		*/
		ajax.onreadystatechange = function (){
			if(ajax.readyState==4&&ajax.status==200){
               var c = ajax.responseText;
               if(c=='1'){
               	alert("添加成功");
               }else{
               	alert("添加失败");
               }
			}
		}
	}
</script>

第三步，向数据库添加数据

<?php
header("content-type:text/html;charset=utf-8");
$name = isset($_POST['name'])?$_POST['name']:'';
$contents = isset($_POST['contents'])?$_POST['contents']:'';

mysql_connect("127.0.0.1",'root','root');
mysql_select_db("1604");
//设置字符集防止乱码
mysql_query("set names utf8");
$sql = "insert into liuyan values(null,'$name','$contents',now())";
//echo $sql;
$res = mysql_query($sql);
if($res){
	//插入成功
	echo 1;
}else{
	echo 2;
}
?>

post传值方式描述