ITKeyword,专注技术干货聚合推荐

注册 | 登录

Java Web笔记 – 客户端Javascript与服务器端Servlet的验证

zi_jun 分享于 2012-11-24

推荐:android手机客户端与Tomcat服务器端servlet通信

忙了一天终于把这个通信搞定了,总结来说有很多低级错误,致使浪费了很多时间,不过在这些浪费的时间里也学到了很多调试代码、寻找错误的方法,如Log日志啊,sys

2019阿里云全部产品优惠券(新购或升级都可以使用,强烈推荐)
领取地址https://promotion.aliyun.com/ntms/yunparter/invite.html

1、验证: 客户端验证: 减少服务器负载
缩短用户等待时间
兼容性难 服务器端验证: 统一确认
兼容性强
服务器负载重 2、使用Javascript进行表单检验的常用方法:

var username = document.getElementById("username");
var username = document.getElementsByName("username")[0];
var nodes = document.getElementsByTagName("input");

  2.1、基本的表单验证例子:

HTML代码:

 
<form onsubmit="return validate()" action="loginServlet">
username:<input type="text" id="username" name="username"/><br />
password:<input type="password" id="username" name="password"><br />
<input type="submit" value="submit" />
</form>

JS验证代码:

function validate(){
    //使用getElementById方法获取元素
    var username = document.getElementById("username");
    var password = document.getElementById("password");

    //使用getElementsByName获取一组元素
    //var username = document.getElementsByName("username")[0];
    //var username = document.getElementsByName("password")[0];

    //获取元素的值 并判断长度
    if(username.value.length == 0){
        alert("用户名不能为空");
        return false;
    }
    if(password.value.length <6){
        alert("密码不能少于6位");
        return false;
    }
    return true;
}

//根据标签获取元素组
var nodes = document.getElementsByTagName("input");
for(var i=0; i<nodes.length; i++){
    //获取标签类型
    alert(nodes[i].type);
}

2.2、单选按钮的验证例子:

HTML代码:

推荐:Android网络编程之——Android登录系统模块的实现(客户端+服务器端Servlet+MySQL)

原博客地址:http://www.cnblogs.com/moka/archive/2013/05/13/3075500.html 写完服务器端之后,开始完成客户端,客户端斜对比较简单,新建一个Android项目结构

男<input type="radio" name="gender" value="男">
女<input type="radio" name="gender" value="女">

JS验证代码:

//单选按钮的验证
var gender = document.getElementsByName("gender");
if(!gender[0].checked && !gender[1].checked){
    alert("请选择性别!");
}

2.3、复选框全选的例子:

HTML代码:

<input type="checkbox" name="selectAll" onclick="selectAll()">Select all<br />
<input type="checkbox" name="number" value="1">1<br />
<input type="checkbox" name="number" value="2">2<br />
<input type="checkbox" name="number" value="3">3<br />
<input type="checkbox" name="number" value="4">4<br />
<input type="checkbox" name="number" value="5">5<br />
<input type="checkbox" name="number" value="6">6<br />
<input type="checkbox" name="number" value="7">7<br />
<input type="checkbox" name="number" value="8">8<br />
<input type="checkbox" name="number" value="9">9<br />
<input type="checkbox" name="number" value="10">10<br /><input type="checkbox" name="number">10<br />

JS代码:

/* 复选框全选的函数 */
function selectAll(){
    var selectAll = document.getElementsByName("selectAll")[0];
    if(selectAll.checked){
        var numbers = document.getElementsByName("number");
        for(var i=0; i<numbers.length; i++){
            numbers[i].checked = true;
        }
    } else {
        for(var i=0; i<nmubers.length; i++){
            numbers[i].checked = false;
        }
    }
}

判断复选框是否有选择:

/* 验证用户选择的个数 */
function validateCheckbox(){
    var n = 0;
    for(var i=0; i<numbers.length; i++){
        if(numbers[i].checked){
            n++;
        }
    }
    if(n < 1){
        alert("至少要选择一项");
    }
}

3、在服务器端使用Servlet进行验证的例子:
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
        throws ServletException, IOException {
    String username = req.getParameter("username");
    String password = req.getParameter("password");
    //获取单选按钮的值
    String gender = req.getParameter("gender");
    //获取复选框的值
    String[] numbers = req.getParameterValues("number");

    List<String> list = new ArrayList<String>();
    //验证判断
    if("".equals(username)){
        list.add("用户名不能为空");
    }
    if(password == null){
        list.add("用户密码不能为空");
    }
    if(password != null && password.length()<6){
        list.add("用户密码不能少于6位");
    }
    //页面跳转
    if(list.isEmpty()){
        req.getRequestDispatcher("index.jsp").forward(req, resp);
    } else {
        req.setAttribute("error", list);
        req.getRequestDispatcher("error.jsp").forward(req, resp);
    }    
}

4、Servlet中的编码设置:
req.setCharacterEncoding("utf-8");
resp.setCharacterEncoding("utf-8");
...
//编码设置
gender = new String(gender.getBytes("iso-8859-1"),"utf-8");

推荐:Servlet学习笔记(一):Web服务器与Tomcat详解

一、端口 http 80 smtp 25 pop3 110 ftp  23 https 443 二、tomcat (一)启动 1、java_home 环境变量 2、端口占用:查看端口的工具(fport.ese) 3、修改Tomcat的

1、验证: 客户端验证: 减少服务器负载 缩短用户等待时间 兼容性难 服务器端验证: 统一确认 兼容性强 服务器负载重 2、使用Javascript进行表单检验的常用方法: var username = document.getE

相关阅读排行


用户评论

游客

相关内容推荐

最新文章

×

×

请激活账号

为了能正常使用评论、编辑功能及以后陆续为用户提供的其他产品,请激活账号。

您的注册邮箱: 修改

重新发送激活邮件 进入我的邮箱

如果您没有收到激活邮件,请注意检查垃圾箱。