jsp中表单如下:

<form method="post" action="AddPlayer">
<div class = "one">
名称:<input type="text" name="name" id="txtName">
</div>
<div class = "one">
身高:<input type="text" name="height" id="txtHeight" >
</div>
<div class = "one">
体重:<input type="text" name="weight" id="txtWeight" >
</div>
<div class = "one">
球队:<select name="teamId">
<c:forEach items="${ teamList }" var="team">
<option value="${ team.id }">${ team.name }</option>
</c:forEach>
</select>
</div>
<br>
<input type="submit" id = "insert" value="添加球员" >
<input type="reset" value="重置">
</form>

validate.jsp如下:

$(function(){
var flag = 0;
$("#insert").click(function() {
if(flag != 3){
alert("输入错误!!!");
return false;
}
});

$("form :input").blur(function(){
$(this).parent().find(".a2").remove();
if ($(this).is("#txtName")){
if(this.value==""){
var s1 = $("<span class='a2 error'>不能为空!</span>");
$(this).parent().append(s1);
}
else{
var s1 = $("<span class='a2 righta'>正确</span>");
$(this).parent().append(s1);
flag = flag + 1;
}
}
//end

if ($(this).is("#txtHeight,#txtWeight")){
if(this.value==""){
var s1 = $("<span class='a2 error'>不能为空!</span>");
$(this).parent().append(s1);
}
else if (this.value!=""&&!/^[0-9]*$/.test(this.value) ){
var s1 = $("<span class='a2 error'>请输入数字!</span>");
$(this).parent().append(s1);
}
else{
var s1 = $("<span class='a2 righta'>正确</span>");
$(this).parent().append(s1);
flag = flag + 1;
}
}
//end
});
});

validate.css略

这样就可以实验每个input的验证了!

JQuery验证input的更多相关文章

  1. jquery验证表单中的单选与多选

    jquery验证表单中的单选与多选 这里所说的,用jquery去验证某一组多选至少要有一个选中,某一组单选至少有一个选中,,大家都知道单一的一个用js比较好验证,但是想要用jquery的验证并且用到j ...

  2. ASP.NET MVC的客户端验证:jQuery验证在Model验证中的实现

    在简单了解了Unobtrusive JavaScript形式的验证在jQuery中的编程方式之后,我们来介绍ASP.NET MVC是如何利用它实现客户端验证的.服务端验证最终实现在相应的ModelVa ...

  3. jquery验证网址格式

    在input中输入网址,用jquery验证输入网址是否正确 <input type="text" name="input-web" class=" ...

  4. 使用jQuery验证用户名是否存在,达到局部刷新的效果

    <%@ page pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...

  5. jQuery验证框架 .

          目录视图 摘要视图 订阅 “程序人生”中国软件开发者职业生涯调查     CSDN社区“三八节”特别活动      开发者职业生涯调查之未来 jQuery验证框架 分类: JQuery 2 ...

  6. jQuery验证表单格式

    工作之余整理一些工作中编写的代码,记录自己工作中的技术要点,便于自己记忆已经整合.以下是关于此jQuery验证的一些标记以及使用方法: 整个js代码都放入jquery_validate_1.1.0.j ...

  7. jQuery 验证实例(shopnc二次开发)

    shopnc 商家用户实现添加用户与前台用户分离, jQuery 验证实例 equalTo:等于 <div id="saleRefund" show_id="1&q ...

  8. jQuery验证插件

    原文:jQuery验证插件 学习要点: 1.使用 validate.js 插件 2.默认验证规则 3.validate()方法和选项 4.validate.js 其他功能 验证插件(validate. ...

  9. [前端] jquery验证手机号、身份证号、中文名称

    验证: 中文姓名.手机号.身份证和地址 HTML(表单): <form action=""> <div class="form-group"& ...

随机推荐

  1. 今天修改bug基本完成

    今天修改bug基本完成 在修改bug过程中配到几个郁闷的问题,印象最深的两个1.检查出生日期或日期的合法性,引用的日历控件不能完全保证取到值时操作,现在突然想到或许我该仔细研究日历控件接口,在返回错误 ...

  2. 网络流(最大流):COGS 28 [NOI2006] 最大获利

    28. [NOI2006] 最大获利 ★★★☆   输入文件:profit.in   输出文件:profit.out   简单对比 时间限制:2 s   内存限制:512 MB [问题描述] 新的技术 ...

  3. 在kafka上对topic新增partition

    对topic增加partition 参考官网site:http://kafka.apache.org/documentation.html#basic_ops_modify_topic 通过kafka ...

  4. ASP.Net MVC-Web API使用Entity Framework时遇到Loop Reference

    原文地址:http://www.it165.net/pro/html/201210/3932.html 最近开始研究Web API,运气不错第一个测试项目就遇到问题@@-当新增Control时选择[A ...

  5. [Locked] Largest BST Subtree

    Largest BST Subtree Given a binary tree, find the largest subtree which is a Binary Search Tree (BST ...

  6. [AS/400] Control Language(CL) 基本概念

    本文内容源于 Go4AS400 简介 AS400 Control Language(CL) 是由指令(Command)组合而成,用于控制操作和调用系统功能.在 CL 程序中,指令用于和系统 OS400 ...

  7. enigma机的原理

    注:本文修改自三思科学<ENIGMA的兴亡>            ENIGMA ENIGMA看起来是一个装满了复杂而精致的元件的盒子.不过要是我们把它打开来,就可以看到它可以被分解成相当 ...

  8. Atom 编辑器 前端基本插件

    Atom 编辑器插件 这个编辑器是github出品,现在处于免费试用期:如果是初学者,可以使用这个编辑器,插件安装很方便,只需要点菜单栏的File-Settings-Install,在搜索框中输入想要 ...

  9. mysql group by的用法 注意

    group by 用法: 官方的解释:select 后面的字段必须出现在 group by 后面, 除非是聚合,sum,或者count 但是如果 是多表联查, SELECT    c.`name` A ...

  10. 实现自己的cp命令

    1 综述 在Unix和Linux系统里,cp是经常使用的一个命令,用于复制文件,用法如下: $cp src_file dest_file 以下就使用若干系统调用来实现自己的cp. 2 原理 open: ...