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. C语言基础课程 第三课 ADB(Android Debug Bridge)的使用

     由于前面已经发布过Linux的博客了 基础班将Linux基础命令就不单独发表博客了,本节课主要就是利用adb连接手机进行一个Linux基本命令的复习.而且熟悉手机的底层运作,不用界面操作照样也能 ...

  2. 线性代数(矩阵乘法):NOI 2007 生成树计数

    这道题就是深搜矩阵,再快速幂. #include <iostream> #include <cstring> #include <cstdio> #include ...

  3. [Sequence Alignment Methods] Cross-Recurrent Plot (CRP)

    A recurrence plot (RP) is a straightforward way to visualize characteristics of similar system state ...

  4. EasyUI-DataGrid之批量删除

    简单介绍一下,涉及到的几个知识点: 1.checkbox,多选 2.前台到后台传值,我用的是字符串拼接,到了后台在拆分的方式 3.批量删除的底层实现 效果图 前台view <table id=& ...

  5. eucalyptus的网络模式

    总共有四种网络模式,默认采用的是system模式 SYSTEM Mode 最简单的网络配置.Eucalyptus分配mac地址,使用 Xen Bridge,配合已有的 DHCP DHCP 來分配 IP ...

  6. Necklace of Beads

    http://poj.org/problem?id=1286 // File Name: poj1286.cpp // Author: bo_jwolf // Created Time: 2013年1 ...

  7. 微信小程序开发手册

    目录: 数据绑定 条件渲染 列表渲染 API FAQ: <block wx:for> 和 <view wx:for>的区别 wx:if 什么情况下判断为假 坑列表: 微信版本6 ...

  8. Info.plist与Prefix.pch修改文件位置遇到的问题及解决方法

    如果要更改Info.plist与Prefix.pch文件实际路径,也就是实际文件的位置(不是在工程中的组织路径),需要到Build Settings中修改对应的配置,不然工程就找不到对应的Info.p ...

  9. poj--1579--(DFS+记忆化搜索之经典)

    记忆化搜索   记忆化搜索:算法上依然是搜索的流程,但是搜索到的一些解用 动态规划的那种思想和模式作一些保存. 一般说来,动态规划总要遍历所有的状态,而搜索可以排除一些无效状态. 更重要的是搜索还可以 ...

  10. POJ 3414 Pots ( BFS , 打印路径 )

    题意: 给你两个空瓶子,只有三种操作 一.把一个瓶子灌满 二.把一个瓶子清空 三.把一个瓶子里面的水灌到另一个瓶子里面去(倒满之后要是还存在水那就依然在那个瓶子里面,或者被灌的瓶子有可能没满) 思路: ...