首先来说用户名验证:

前台:

<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实现简单表单验证的更多相关文章

  1. 如何利用jQuery进行简单表单验证

    <!DOCTYPE html><html><head><meta charset="utf-8"><meta name=&qu ...

  2. 基于Jquery Validate 的表单验证

    基于Jquery Validate 的表单验证 jquery.validate.js是jquery下的一个验证插件,运用此插件我们可以很便捷的对表单元素进行格式验证. 在讲述基于Jquery Vali ...

  3. 基于jQuery的Validate表单验证

    表单验证可以说在前端开发工作中是无处不在的~ 有数据,有登录,有表单, 都需要前端验证~~  而我工作中用到最多的就是基于基于jQuery的Validate表单验证~  就向下面这样~ 因为今天有个朋 ...

  4. jQuery Validation Engine 表单验证

    功能强大的 jQuery 表单验证插件,适用于日常的 E-mail.电话号码.网址等验证及 Ajax 验证,除自身拥有丰富的验证规则外,还可以添加自定义的验证规则. 兼容 IE 6+, Chrome, ...

  5. jquery.validation.js 表单验证

    jquery.validation.js 表单验证   官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuer ...

  6. Jquery.validate.js表单验证插件的使用

    作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...

  7. 异步提交form的时候利用jQuery validate实现表单验证

    异步提交form的时候利用jQuery validate实现表单验证相信很多人都用过jquery validate插件,非常好用,并且可以通过下面的语句来自定义验证规则    // 电话号码验证    ...

  8. JQuery+formValidator实现表单验证

    <!-- 需求: 用户注册页面要有用户名.密码.确认密码.邮箱 用户名文本框:用户名不能为空,且必须为数字与字母的6到12位的组合 密码框:密码不能为空,最少6位,包括至少1个大写字母,1个小写 ...

  9. JQuery制作网页——表单验证

      1.  表单验证:减轻服务器的压力.保证输入的数据符合要求: 2.  常用的表单验证:日期格式.表单元素是否为空.用户名和密码.E-mail地址.身份证号码等: 3.  表单验证的思路: 1.   ...

随机推荐

  1. [译]async/await中阻塞死锁

    这篇博文主要是讲解在async/await中使用阻塞式代码导致死锁的问题,以及如何避免出现这种死锁.内容主要是从作者Stephen Cleary的两篇博文中翻译过来. 原文1:Don'tBlock o ...

  2. [Swift]LeetCode136. 只出现一次的数字 | Single Number

    Given a non-empty array of integers, every element appears twice except for one. Find that single on ...

  3. 项目总结四:神经风格迁移项目(Art generation with Neural Style Transfer)

    1.项目介绍 神经风格转换 (NST) 是深部学习中最有趣的技术之一.它合并两个图像, 即 内容图像 C(content image) 和 样式图像S(style image), 以生成图像 G(ge ...

  4. SpringCloud(9)---mysql实现配置中心

    mysql实现配置中心 本公司配置数据的管理是通过mysql进行配置管理,因为已经搭建好了,所以自己动手重新搭建一遍,熟悉整个流程.有关项目源码后期会补上github地址 微服务要实现集中管理微服务配 ...

  5. npm 包的 发布 流程

    npm 包的发布流程 本文主要是针对 还未曾发布过自己的 npm 的同学,阐述一下 npm 的发布流程 熟悉的同学,可以绕道了. 首先你得有一个 自己的 npmjs.com 的账号 (没有的话,就到 ...

  6. Solr 02 - 最详细的solrconfig.xml配置文件解读

    目录 1 luceneMatchVersion - 指定Lucene版本 2 lib - 配置扩展jar包 3 dataDir - 索引数据路径 4 directoryFactory - 索引存储工厂 ...

  7. 带着萌新看springboot源码04

    继续开头说些废话,我也不知道什么鬼,每次写着写着经常会写到其他地方去了,太容易分神了. 这次说一下springboot对于springmvc的大概整个流程,以请求动态网页为例 . 1.梳理一下spri ...

  8. 【Python3爬虫】网易云音乐爬虫

    此次的目标是爬取网易云音乐上指定歌曲所有评论并生成词云 具体步骤: 一:实现JS加密 找到这个ajax接口没什么难度,问题在于传递的数据,是通过js加密得到的,因此需要查看js代码. 通过断掉调试可以 ...

  9. Java虚拟机详解----JVM内存结构

    http://www.cnblogs.com/smyhvae/p/4748392.htm 主要内容如下: JVM启动流程 JVM基本结构 内存模型 编译和解释运行的概念 一.JVM启动流程: JVM启 ...

  10. centos7默认防火墙firewalld

    1.开关 启动: systemctl start firewalld 查看状态: systemctl status firewalld  停止: systemctl disable firewalld ...