Ajax(Asynchronous JavaScript and Xml),整合了JavaScript,XML,CSS,DOM,Ajax引擎(XMLHttpRequest).

JavaScript语言:Ajax技术主要开发语言。

XML/JSON/HTML等:用来封装请求或响应数据格式。

DOM（文档对象模型）通过DOM属性或方法修改页面元素，实现页面局部刷新。

CSS：改变样式，美化页面效果，提升用户体验度。

Ajax引擎：即XMLHttpRequest对象,以异步方法在客户端与服务器端回见专递数据.

下面我们来下一个例子了解一下Ajax检验

首先

1.搭建一个web工程

2.在index.jsp ajax 验证用户名是否重复

步骤1：
根据能力检测创建和核心对象

步骤2:
xhr.open(请求类型，请求地址，是否异异步)

步骤3：
设置回调函数
xhr.onreadystatechange=function(){
if(xhr.readyState==4&&xhr.status==200){
//响应状态已经切换到了4，并且状态码是200
//xhr.responseText;
} 

}

步骤4：发送
xhr.send();
2.使用ajax发送post请求 必须指定Content-Type
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

下面来 看一下代码展示

jsp页面展示(Ajax数据校验)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
     
    <title>My JSP 'index.jsp' starting page</title>
    <script type="text/javascript">
     
      //给文本框注册一个失去焦点事件
    window.onload=function(){
        var dom=document.getElementById("txtName");
          dom.onblur=function(){
             myajax();
          };
     
    };
       
     
    function myajax(){
     
       //01.定制出 xhr对象
       var xhr;
       //02.能力检测
       if(window.XMLHttpRequest){
           //非IE浏览器  
          xhr=new XMLHttpRequest();
       }else{
          //IE内核
          xhr=new ActiveXObject("Microsoft.XMLHttp");
       }
        var dom=document.getElementById("txtName");
        var myspan=document.getElementById("msg");
        var myval=dom.value;
       //03.构建请求地址
       //xhr.open("请求类型","请求地址","是否异步");
       xhr.open("get","<%=path%>/servlet/CheckUserServlet?uname="+myval,true);
 
       //04.设置回调函数     响应回来的数据
       xhr.onreadystatechange=function(){
         //什么
         if(xhr.readyState==4&&xhr.status==200){
            //获取响应数据
            var data=xhr.responseText;
            if(data=='OK'){
                 
                 myspan.innerText="已被注册";
            }else{
             
                 myspan.innerText="可注册,是否使用";
            }
         }
       };
        
        
       //05.用send真正的发送请求
       xhr.send(null);
 
       }
        
    </script>
  </head>
   
  <body>
    用户名:<input type="text" name="txtName" id="txtName"/> <span id="msg"></span><br/>
    密      码:<input type="password" name="txtPwd"/>
  </body>
</html>

action类　(servlet)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
package cn.happy.servlet;
 
import java.io.IOException;
import java.io.PrintWriter;
 
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
public class CheckUserServlet extends HttpServlet {
 
     
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doPost(request,response);
         
    }
 
     
    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        String uname = request.getParameter("uname");
        if (uname.equals("admin")) {
            //用户已经被注册了
            //回送 信息
            response.getWriter().write("OK");
        }else {
            response.getWriter().write("NO");
        }
            
    }
 
}

实现效果

struts2中Ajax校验的更多相关文章

  1. Struts2中的校验框架

    Struts2提供的客户端校验 尽管这种支持比较弱,但采用Struts2中的客户端校验时需要注意以下几点 1..将<s:form validate="true">的va ...

  2. struts2中ajax的使用

    前面写过原生js实现ajax的博客,但是用起来不是太方便,jquery对原生的js进行了很好的封装,使用起来也更简单:但是在项目中使用了struts2,处理ajax却又不同,花了几天时间研究,终于解决 ...

  3. struts2实现ajax校验的2种方法

    共同的一点是,Action都需要将一个方法暴露出来,给前端javascript调用  javascript的代码都是一样的: Js代码   function testAjax() { var $use ...

  4. Struts2与ajax整合之缺点

    之前有篇博客介绍了Struts2与ajax的整合,链接Struts2之-集成Json插件实现Ajax 这里不再累述,看以上博客. 此篇博客想吐槽一下Struts2的缺点--错误处理做的不好,怎么做的不 ...

  5. struts2：数据校验，通过Action中的validate()方法实现校验，图解

    根据输入校验的处理场所的不同,可以将输入校验分为客户端校验和服务器端校验两种.服务器端验证目前有两种方式: 第一种 Struts2中提供了一个com.opensymphony.xwork2.Valid ...

  6. struts2：数据校验，通过Action中的validate()方法实现校验（续：多业务方法时的不同验证处理）

    前文:struts2:数据校验,通过Action中的validate()方法实现校验,图解 如果定义的Action中存在多个逻辑处理方法,且不同的处理逻辑可能需要不同的校验规则,在这种情况下,就需要通 ...

  7. Struts2中validate数据校验的两种常用方法

    本文主要介绍Struts2中validate数据校验的两种方法及Struts2常用校验器.  1.Action中的validate()方法 Struts2提供了一个Validateable接口,这个接 ...

  8. struts2中各个jar包作用

    Struts2.3.4 所需的Jar包及介绍 Jar包的分类 jar包名称 jar包版本 jar包 文件名 jar包 的作用 jar包内包含的主要包路径及主要类 依赖的自有jar包名称 依赖的第三方j ...

  9. struts2中的jar包

    核心包: (后面数字是版本号,不同struts2版本,数字可能不一样.) struts2-core-2.1.8.1 struts2的核心jar包,不可缺少的 xwork-core-2.1.6 xwor ...

随机推荐

  1. 从零开始编写自己的C#框架（18）——Web层后端权限模块——菜单管理

    从本章开始,主要讲解的是页面中对框架相关功能的调用方法,比如列表页面(又分为有层次感列表和普通列表).编辑页面.多标签页面等,只要熟悉了这些函数的使用方法,那么开发起来就会很便捷了. 1.如图先创建菜 ...

  2. Android popupwindow使用心得（一）

    最近项目中好多地方用到popupwindow,感觉这个控件还是非常重要的.所以把使用心得总结下,废话不多说,直接上代码. public class MainActivity extends Activ ...

  3. C# 获取Excel中的合并单元格

    C# 获取Excel中的合并单元格 我们在制作表格时,有时经常需要合并及取消合并一些单元格.在取消合并单元格时需要逐个查找及取消,比较麻烦.这里分享一个简单的方法来识别Excel中的合并单元格,识别这 ...

  4. [入门级] 基于 visual studio 2010 mvc4 的图书管理系统开发初步 （二）

    [入门级] 基于 visual studio 2010 mvc4 的图书管理系统开发初步 (二) Date  周六 10 一月 2015 By 钟谢伟 Category website develop ...

  5. 在web浏览器上显示室内温度（nodeJs+arduino+socket.io）

    上次的nodejs操作arduino入门篇中实现了如何连接arduino.这次我们来实现通过arduino测量室内温度并在浏览器上显示出来. [所需材料] 硬件:LM35温度传感器,arduino u ...

  6. Nancy之大杂烩

    Nancy关于Hosting的简单介绍 一. Nancy之基于Nancy.Hosting.Aspnet的小Demo 二.Nancy之基于Nancy.Hosting.Self的小Demo 三.Nancy ...

  7. 第一篇 Entity Framework Plus 之 Audit

    一般系统会有登陆日志,操作日志,异常日志,已经满足大部分的需求了.但是有时候,还是需要Audit 审计日志,审计日志,主要针对数据增,改,删操作数据变化的记录,主要是对数据变化的一个追踪过程.其中主要 ...

  8. C#开发微信门户及应用(34)--微信裂变红包

    在上篇随笔<C#开发微信门户及应用(33)--微信现金红包的封装及使用>介绍了普通现金红包的封装和使用,这种红包只能单独一次发给一个人,用户获取了红包就完成了,如果我们让用户收到红包后,可 ...

  9. [连载]《C#通讯（串口和网络）框架的设计与实现》- 14.序列号的设计，不重复的实现一机一码

    目       录 第十四章     序列号的设计... 2 14.1        设计原则... 2 14.2        设计思想... 3 14.3        代码实现... 4 14. ...

  10. jdk jre jvm 三者之间关系

    JDK JDK是java开发工具包,是Sun公司针对Java开发员的产品.     JDK 中包含JRE,在JDK安装的目录下有一个叫jre的目录,里面有两个文件夹,bin/和lib,其中bin就是j ...