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请求的更多相关文章

  1. 使用Ajax发送http请求(get&post请求)

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 同步和异步 同步和异步的概念 同步:必须等待前面的任务完成,才能继续后面 ...

  2. AJAX发送PUT请求引发的血案

    如果直接发送ajax=put形式的请求      是拿不到请求体中的数据的.           Tomcat:              1.将请求体中的数据,封装一个map             ...

  3. AJAX的来龙去脉(由来)-如何被封装出来的--ajax发送异步请求(四步操作)

    <黑马程序员_超全面的JavaWeb视频教程vedio\JavaWeb视频教程_day23_ajax> \JavaWeb视频教程_day23_ajax\day23ajax_avi\14.打 ...

  4. Ajax发送POST请求对数据的封装

    Ajax发送POST请求把数据到后端后,后端收到数据并解析出来 示列一: Ajax发送请求,这里主要是发送一个数组的数据类型到后端,如果没有先把数组进行格式化成字符串的话,后端就收了就是一个字符串类型 ...

  5. 原生JS实现ajax 发送post请求

    1. [代码]原生JS实现ajax 发送post请求 <script> var oStr = ''; var postData = {}; var oAjax = null; //post ...

  6. IT兄弟连 JavaWeb教程 使用AJAX发送POST请求并获取响应

    POST请求用于向服务器发送应该被保存的数据,因此POST请求天然比GET请求多需要一份需要被保存的数据.那么这些数据应该放在何处呢?毕竟,我们的open()方法接收的三个参数都没有合适的位置. 答案 ...

  7. IT兄弟连 JavaWeb教程 使用AJAX发送GET请求并获取响应

    GET请求用于获取数据,有时候我们需要获取的数据需要通过"查询参数"进行定位,在这种情况下,我们会将查询参数追加到URL的末尾,令服务器解析. 使用Ajax发送GET请求非常简单, ...

  8. Ajax发送XML请求案例

    Ajax发送XML请求需求: 根据输入的国家,输出这些国家下面的城市. 如果请求参数较多,而且请求参数的结构关系复杂,则可以考虑发送XML请求.XML请求的实质还是POST请求,只是在发送请求的客户端 ...

  9. ajax发送PUT请求,使用HttpPutFormContentFilter过滤器接受办法

    相信在使用ajax发送put请求时候,肯定遇到过后端数据无法被接受到的405错误. 为什么会遇到这个问题? 1.首先查看Tomcat源码 关于如何将数据封装到Request public class ...

随机推荐

  1. [置顶] IOS7状态栏StatusBar官方标准适配方法

    IOS7状态栏StatusBar官方标准适配方法 hello,大家好,ios7正式版已经发布,相信大家都在以各种方式来适配ios7. 如果你已经下载了xcode5,正准备使用,你会发现各种布局的改变. ...

  2. 【转载】cocos2d-x2.2.3和android的平台环境

    这两天试图按照教程来学习写游戏移植到的横版过关Android在.在网上找了很多教程,但版本号变化.所使用的工具有细微的差别.所以,现在我们还没有准备好,阅读后,下面的文章.最后能够顺利您的手机上跑起来 ...

  3. 为iPhone6设计自适应布局(二)

    Size Classes 自适应布局的布局约束自然是好东西,但也不是万能的,有时候我们也需要使用最基本的布局,所以使用size classes将它们两者结合起来才能碰撞出更有激情的火花. 引用我上篇译 ...

  4. QT实现透明效果的按钮

    QPushButton { color: rgb(0,88,152) background-color: rgba(97%,80%,9%,50%)}

  5. Mysql 细节记忆

    DELIMITER $$ 和 DELIMITER ; DROP PROCEDURE IF EXISTS `pro_follow_getBookBeforeExpired`$$ DECLARE p_Se ...

  6. SpinLock(自旋锁)

    SpinLock(自旋锁) SpinLock 结构是一个低级别的互斥同步基元,它在等待获取锁时进行旋转. 在多核计算机上,当等待时间预计较短且极少出现争用情况时,SpinLock 的性能将高于其他类型 ...

  7. 关于百度鹰眼中 xcode 7 编译报错问题

    请把 这个地方改为 YES 否则demo 不能运行

  8. TelerikUI_RadGrid_Filter 自定义方法

    要设置 EnableLinqExpressions="false",搞了3,4个小时没反应,就是没有设置这个 Protected Sub btnSearch_Click(sende ...

  9. shell中的case表达式

    语法格式 case var in pattern1 | patter2) command1 command2;; pattern3) command1 command2;; *) default co ...

  10. 【6】Laravel5.1的migration数据库迁移

    查看Laravel5.1的目录 当你配置好数据库后,在命令行执行下边的操作 php artisan migrate 打开数据库会发现,我们的数据库多了四个表,神奇吧! 打开任意一个migration查 ...