Ajax之post请求

我不是女神ヾ 2022-05-20 06:42 305阅读 0赞

# ajax之get请求需要注意的四个地方： #

1.  给服务器传递数据需要调用send（请求字符串数据）方法
2.  调用方法setRequestHeader()把传递的数据组织为xml格式（模仿form表单传递数据）
3.  传递的中文信息无需编码，特殊符号像&、=等仍需要编码
4.  该方式请求的同时也可以传递get参数信息，同样使用$\_GET接收该信息

# ajax发起post请求 #

# 服务器端03.php： #

<?php
    
    //接收post方式传递过来的“用户名”信息，并做数据库校验
    echo "post:";
    print_r($_POST);
    
    echo "get:";
    print_r($_GET);

# 客户端03post.html： #

<!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>ajax-get请求</title>
    	<script type="text/javascript">
    	function checkname(){
    		//ajax方式用户名校验
    		//第一步：获取用户名信息
    		var nm = document.getElementById('username').value;
    
    		//对传递的特殊符号（例如&、=等）进行编码处理
    		//同时对中文也进行编码处理
    		 nm = encodeURIComponent(nm);
    
    		//把用户名信息变为“请求字符串”
    		var info = "name="+nm+"&age=23";
    
    		//第二步：ajax校验
    		var xhr = new XMLHttpRequest();
    		//ajax事件设置，以便接收返回的信息
    		xhr.onreadystatechange = function(){
    			if(xhr.readyState == 4){
    				alert(xhr.responseText);
    			}
    		}
    		xhr.open('post', './03.php?addr=beijing');//加入了get参数信息
    		//post方式传递数据是模拟form表单传递数据
    		//form表单的post格式数据是通过xml形式传递给服务器的
    		//以下setRequestHeader()方法必须要在open()方法后调用
    		xhr.setRequestHeader("content-type", "application/x-www-form-urlencoded");
    		xhr.send(info);
    	}
    	</script>
    </head>
    <body>
    	<h2>ajax之用户名的校验（post方式）</h2>
    	<p>用户名：<input type="text" id="username" οnblur="checkname()"></p>
    	<p>手机号码：<input type="text" id="usertel"></p>
    </body>
    </html>

# 注意的地方： #

# post方式请求需要把信息组织为请求字符串传递给send()方法： #

![WEBRESOURCE935f720d4b546c9de21629dad42860c4][]

#  #

# post方式请求需要设置header头协议，以便把数据组织为xml格式： #

![WEBRESOURCEb41b36d060215986ee7fd29efee76ea1][]

# 通过xml格式传递post表单信息的标志： #

![WEBRESOURCE857f947e7b49d5614964f5976928e934][]

# post请求的同时也可以传递get参数信息，同样使用$\_GET接收该信息 #

![WEBRESOURCE97af937aa4ac57e716387fc00343e327][]

[WEBRESOURCE935f720d4b546c9de21629dad42860c4]: https://note.youdao.com/yws/res/4724/WEBRESOURCE935f720d4b546c9de21629dad42860c4
[WEBRESOURCEb41b36d060215986ee7fd29efee76ea1]: https://note.youdao.com/yws/res/4738/WEBRESOURCEb41b36d060215986ee7fd29efee76ea1
[WEBRESOURCE857f947e7b49d5614964f5976928e934]: https://note.youdao.com/yws/res/4731/WEBRESOURCE857f947e7b49d5614964f5976928e934
[WEBRESOURCE97af937aa4ac57e716387fc00343e327]: https://note.youdao.com/yws/res/4745/WEBRESOURCE97af937aa4ac57e716387fc00343e327