关于ajax用户名验证和jquery实现简单表单验证
首先来说用户名验证:
前台:
<tr>
<td class="tableleft">教师编号</td>
<td><input type="text" name="tno" id="tno" required="required"/><div class="status" style="color:red"></div></td>
</tr>
js部分:
var flag = true;
$("#tno").blur(function(){
var tno = $("#tno").val();
$.ajax({
url:"admin/checktno.action",
data:{tno:tno},
type:"post",
datatype:"text",
success:function(data){
if(data=="yes"){
$(".status").html("");
flag=true;
}else{
$(".status").html("教工号已存在!");
flag=false;
}
},
errot:function(){
alert("error!");
}
});
}); $("#submitbutton").click(function(){
if(flag){
$("#form").submit();
}else{
alert("请先满足条件!");
}
});
后台:
@RequestMapping("admin/checktno")
@ResponseBody
public String checkTno(Long tno) {
Teacher tea = teacherService.getTea(tno);
if(tea == null) {
return "yes";
}
return "no";
}
接下来简单用jquery的jquery.validate插件
下载该插件,地址:https://jqueryvalidation.org/
导入:
<script type="text/javascript" src="Js/jquery.validate.min.js"></script>
接下来就是验证部分的js:
$("#form").validate({
onsubmit:true,// 是否在提交时验证
rules: {
tno: {
required: true,
minlength: 1
},
password: {
required: true,
minlength: 3
} ,
tname:{
required: true
}
},
messages: {
tno: {
required: "请输入教工号",
minlength: "教工号至少为1位"
},
password: {
required: "请输入密码",
minlength: "密码长度最少为3位"
},
tname:{
required:"请输入姓名"
}
}
})
关于ajax用户名验证和jquery实现简单表单验证的更多相关文章
- 如何利用jQuery进行简单表单验证
<!DOCTYPE html><html><head><meta charset="utf-8"><meta name=&qu ...
- 基于Jquery Validate 的表单验证
基于Jquery Validate 的表单验证 jquery.validate.js是jquery下的一个验证插件,运用此插件我们可以很便捷的对表单元素进行格式验证. 在讲述基于Jquery Vali ...
- 基于jQuery的Validate表单验证
表单验证可以说在前端开发工作中是无处不在的~ 有数据,有登录,有表单, 都需要前端验证~~ 而我工作中用到最多的就是基于基于jQuery的Validate表单验证~ 就向下面这样~ 因为今天有个朋 ...
- jQuery Validation Engine 表单验证
功能强大的 jQuery 表单验证插件,适用于日常的 E-mail.电话号码.网址等验证及 Ajax 验证,除自身拥有丰富的验证规则外,还可以添加自定义的验证规则. 兼容 IE 6+, Chrome, ...
- jquery.validation.js 表单验证
jquery.validation.js 表单验证 官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuer ...
- Jquery.validate.js表单验证插件的使用
作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...
- 异步提交form的时候利用jQuery validate实现表单验证
异步提交form的时候利用jQuery validate实现表单验证相信很多人都用过jquery validate插件,非常好用,并且可以通过下面的语句来自定义验证规则 // 电话号码验证 ...
- JQuery+formValidator实现表单验证
<!-- 需求: 用户注册页面要有用户名.密码.确认密码.邮箱 用户名文本框:用户名不能为空,且必须为数字与字母的6到12位的组合 密码框:密码不能为空,最少6位,包括至少1个大写字母,1个小写 ...
- JQuery制作网页——表单验证
1. 表单验证:减轻服务器的压力.保证输入的数据符合要求: 2. 常用的表单验证:日期格式.表单元素是否为空.用户名和密码.E-mail地址.身份证号码等: 3. 表单验证的思路: 1. ...
随机推荐
- [译]async/await中阻塞死锁
这篇博文主要是讲解在async/await中使用阻塞式代码导致死锁的问题,以及如何避免出现这种死锁.内容主要是从作者Stephen Cleary的两篇博文中翻译过来. 原文1:Don'tBlock o ...
- [Swift]LeetCode136. 只出现一次的数字 | Single Number
Given a non-empty array of integers, every element appears twice except for one. Find that single on ...
- 项目总结四:神经风格迁移项目(Art generation with Neural Style Transfer)
1.项目介绍 神经风格转换 (NST) 是深部学习中最有趣的技术之一.它合并两个图像, 即 内容图像 C(content image) 和 样式图像S(style image), 以生成图像 G(ge ...
- SpringCloud(9)---mysql实现配置中心
mysql实现配置中心 本公司配置数据的管理是通过mysql进行配置管理,因为已经搭建好了,所以自己动手重新搭建一遍,熟悉整个流程.有关项目源码后期会补上github地址 微服务要实现集中管理微服务配 ...
- npm 包的 发布 流程
npm 包的发布流程 本文主要是针对 还未曾发布过自己的 npm 的同学,阐述一下 npm 的发布流程 熟悉的同学,可以绕道了. 首先你得有一个 自己的 npmjs.com 的账号 (没有的话,就到 ...
- Solr 02 - 最详细的solrconfig.xml配置文件解读
目录 1 luceneMatchVersion - 指定Lucene版本 2 lib - 配置扩展jar包 3 dataDir - 索引数据路径 4 directoryFactory - 索引存储工厂 ...
- 带着萌新看springboot源码04
继续开头说些废话,我也不知道什么鬼,每次写着写着经常会写到其他地方去了,太容易分神了. 这次说一下springboot对于springmvc的大概整个流程,以请求动态网页为例 . 1.梳理一下spri ...
- 【Python3爬虫】网易云音乐爬虫
此次的目标是爬取网易云音乐上指定歌曲所有评论并生成词云 具体步骤: 一:实现JS加密 找到这个ajax接口没什么难度,问题在于传递的数据,是通过js加密得到的,因此需要查看js代码. 通过断掉调试可以 ...
- Java虚拟机详解----JVM内存结构
http://www.cnblogs.com/smyhvae/p/4748392.htm 主要内容如下: JVM启动流程 JVM基本结构 内存模型 编译和解释运行的概念 一.JVM启动流程: JVM启 ...
- centos7默认防火墙firewalld
1.开关 启动: systemctl start firewalld 查看状态: systemctl status firewalld 停止: systemctl disable firewalld ...