Ajax发送Post请求
Ajax发送post请求与发送get请求大致类似。以下看详细实例。首先看JSP显示页面:
<form action="servlet/LoginServlet" method="post">
<table>
<tr>
<td>用户账号:</td>
<td><input type="text" name="username" onblur="checkUser(this)"/></td>
</tr>
<tr>
<td>用户密码:</td>
<td><input type="password" name="password"/></td>
</tr>
<tr>
<td><input type="submit" value="注冊"/></td>
<td><input type="reset" value="重置"></td>
</tr>
</table>
</form>
然后看对发送信息进行处理的Servlet类。由于是POST方式发送信息,所以看一下doPost方法。
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { response.setContentType("text/html;charaet=UTF-8");
PrintWriter out = response.getWriter();
String name=request.getParameter("username");
if(name.equals("admin"))
out.print(false);
else
out.print(true);
out.flush();
out.close();
}
然后看javascript怎样实现Ajax请求
<script type="text/javascript">
//创建XMLHttpRequest
function createXmlHttpRequest(){
if(window.XMLHttpRequest){
return new XMLHttpRequest();
}else{
return new ActiveXObject("Microsoft.XMLHTTP");
}
}
//当用户账号输入框失去焦点时调用该方法
function checkUser(obj){
//获取输入框输入的值
var user = obj.value;
//假设输入框中的值为空。那么弹窗提示。而且让该输入框获得焦点
if(!user){
alert("username不能为空! ");
obj.focus();
return;
}
//不为空时。使用Ajax请求向后台发送信息,验证该username是否可用
//post请求字符串
var url="servlet/LoginServlet";
//请求參数
var userinfo = "username="+user;
//调用方法创建XMLHttpRequest对象
XmlHttpRequest = createXmlHttpRequest();
//设置回调函数
XmlHttpRequest.onreadystatechange=finish;
//初始化xmlhttprequest
XmlHttpRequest.open("POST",url,true);
XmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//发送请求
XmlHttpRequest.send(userinfo);
}
//回调函数
function finish(){
if(XmlHttpRequest.readyState == 4&& XmlHttpRequest.status == 200){
var result = XmlHttpRequest.responseText;
alert(result);
if(result =="true"){
alert("username可用!");
}else{
alert("username不可用!");
}
}
}
</script>
Ajax发送Post请求的更多相关文章
- 使用Ajax发送http请求(get&post请求)
		
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 同步和异步 同步和异步的概念 同步:必须等待前面的任务完成,才能继续后面 ...
 - AJAX发送PUT请求引发的血案
		
如果直接发送ajax=put形式的请求 是拿不到请求体中的数据的. Tomcat: 1.将请求体中的数据,封装一个map ...
 - AJAX的来龙去脉(由来)-如何被封装出来的--ajax发送异步请求(四步操作)
		
<黑马程序员_超全面的JavaWeb视频教程vedio\JavaWeb视频教程_day23_ajax> \JavaWeb视频教程_day23_ajax\day23ajax_avi\14.打 ...
 - Ajax发送POST请求对数据的封装
		
Ajax发送POST请求把数据到后端后,后端收到数据并解析出来 示列一: Ajax发送请求,这里主要是发送一个数组的数据类型到后端,如果没有先把数组进行格式化成字符串的话,后端就收了就是一个字符串类型 ...
 - 原生JS实现ajax 发送post请求
		
1. [代码]原生JS实现ajax 发送post请求 <script> var oStr = ''; var postData = {}; var oAjax = null; //post ...
 - IT兄弟连 JavaWeb教程 使用AJAX发送POST请求并获取响应
		
POST请求用于向服务器发送应该被保存的数据,因此POST请求天然比GET请求多需要一份需要被保存的数据.那么这些数据应该放在何处呢?毕竟,我们的open()方法接收的三个参数都没有合适的位置. 答案 ...
 - IT兄弟连 JavaWeb教程 使用AJAX发送GET请求并获取响应
		
GET请求用于获取数据,有时候我们需要获取的数据需要通过"查询参数"进行定位,在这种情况下,我们会将查询参数追加到URL的末尾,令服务器解析. 使用Ajax发送GET请求非常简单, ...
 - Ajax发送XML请求案例
		
Ajax发送XML请求需求: 根据输入的国家,输出这些国家下面的城市. 如果请求参数较多,而且请求参数的结构关系复杂,则可以考虑发送XML请求.XML请求的实质还是POST请求,只是在发送请求的客户端 ...
 - ajax发送PUT请求,使用HttpPutFormContentFilter过滤器接受办法
		
相信在使用ajax发送put请求时候,肯定遇到过后端数据无法被接受到的405错误. 为什么会遇到这个问题? 1.首先查看Tomcat源码 关于如何将数据封装到Request public class ...
 
随机推荐
- JSP实现分页功能
			
分页须知知识点: (1)JDBC2.0的可滚动结果集. (2)HTTP GET请求. 一.可滚动结果集 Connection con = DriverManager.getConnection( ...
 - easyui-combobox默认值绑定
			
$('#combox_role').combobox({ panelHeight: , url: '../../Handler/GetComboxItems.ashx?type=0', valueFi ...
 - C# 模拟键盘按键操作
			
[DllImport("user32.dll")] public static extern IntPtr keybd_event(byte bVk, byte bScan, in ...
 - asp.net实现将网页内容输出到word并下载到本地
			
个人觉得要实现这个功能如果没有类库提供的几个关键函数,还是比较繁琐的.所以首先介绍几个将要在代码中使用的关键函数和参数,然后再说函数实现.注意问题等. 关键函数: 1.函数原型:Response.Ap ...
 - 开源项目Material Calendar View 学习记录 (一)
			
开源项目Material Calendar View 学习记录 Github: https://github.com/prolificinteractive/material-calendarview ...
 - 安卓状态栏通知Status Bar Notification
			
安卓系统通知用户三种方式: 1.Toast Notification 2.Dialog Notification 3.Status Bar Notification Status Bar Notifi ...
 - C#读取XML配置文件
			
DataSource.xml文件,要放在bin/debug/目录下: <?xml version="1.0" encoding="utf-8" ?> ...
 - IOS网络开发实战(一)
			
1 局域网群聊软件 1.1 问题 UDP协议将独立的数据包从一台计算机传输到另外一台计算机,但是并不保证接受方能够接收到该数据包,也不保证接收方所接收到的数据和发送方所发送的数据在内容和顺序上是完 ...
 - Bootstrap新手常见问题
			
题记 bootstrap这个开源的UI库确实很方便,用了两日,觉得不错,但也有些问题比较头疼! 主题 1.怎么使用?怎么定制?下面是一个范例,修改了navbar的颜色,重新设置了select控件的默认 ...
 - xml解析,练习
			
<collection shelf="New Arrivals"><movie title="Enemy Behind"> < ...