ajax jquery校验用户是否已经注册
服务端代码这里就不贴了
html代码比较简单，需要自行引入jquery库
<body>
请输入用户名:<input type="text" id="userName" class="userText"/> <input type="button" value="校验" id="verifyButton" />
<div id="result"></div>
</body>
js代码
/*
* 在页面装载完成时注册上这些工作
* */
$(document).ready(function() {
//这里面的内容就是页面装载完成后需要执行的代码
var userNameNode = $("#userName");
//需要找到button按扭，注册事件
$("#verifyButton").click(function() {
//1.获取文本框的内容
var userName = userNameNode.val();
//2.将这个内容发送给服务器端
if (userName == "") {
alert("用户名不能为空");
} else {
$.get("http://127.0.0.1:8080/JQuery/UserVerify?userName=" + encodeURI(encodeURI(userName)),null,function(response){
//3.接收服务器端返回的数据，填充到div中
$("#result").html(response);
}); }
});
//需要找到文本框，注册事件
userNameNode.keyup(function(){
//获取当前文本框中的内容
var value = userNameNode.val();
if (value == "") {
//让边框变成红色，并且带背景图
userNameNode.addClass("userText");
} else {
//去掉边框和背景图
userNameNode.removeClass("userText"); }
});
});
css样式，目的是让文本框中没有内容的时候边框为红色并下方有红色波浪
.userText {
/*控制文本框的边框是红色的实线*/
border: 1px solid red;
background-image: url(../images/userVerify.gif);
background-repeat: repeat-x;
background-position: bottom;
}
ajax jquery校验用户是否已经注册的更多相关文章
- Struts2+AJAX+JQuery 实现用户登入与注册功能。
要求 必备知识 JAVA/Struts2,JS/JQuery,HTML/CSS基础语法. 开发环境 MyEclipse 10 演示地址 演示地址 预览截图(抬抬你的鼠标就可以看到演示地址哦): 关于U ...
- Struts2+AJAX+JQuery 实现用户登入与注册功能
要求:必备知识:JAVA/Struts2,JS/JQuery,HTML/CSS基础语法:开发环境:MyEclipse 10 关于UI部分请查看下列链接,有详细制作步骤: 利用:before和:afte ...
- 零基础学习java------35---------删除一个商品案例，删除多个商品，编辑（修改商品信息），校验用户名是否已经注册（ajax）
一. 删除一个商品案例 将要操作的表格 思路图 前端代码 <%@ page language="java" contentType="text/html; cha ...
- MVC3学习：利用mvc3+ajax检测用户是否被注册
假设用户名是保存在表Users中.关系模式为Users(Uid,UserName,PassWord) 可先利用mvc自带的模板生成Create页面. 将填写用户名的地方,由原来的 <div cl ...
- ajax实现注册用户名时动态显示用户名是否已经被注册（1、ajax可以实现我们常见的注册用户名动态判断）（2、jquery里面的ajax也是类似我们这样封装了的函数）
ajax实现注册用户名时动态显示用户名是否已经被注册(1.ajax可以实现我们常见的注册用户名动态判断)(2.jquery里面的ajax也是类似我们这样封装了的函数) 一.总结 1.ajax可以实现我 ...
- MVC中处理表单提交的方式（Ajax+Jquery）
MVC中处理表单有很多种方法,这里说到第一种方式:Ajax+Jquery 先看下表单: <form class="row form-body form-horizontal m-t&q ...
- Ajax&jQuery教案总结
Ajax&jQuery教程总结 目录 第一章 Ajax入门 6 第1讲 传统表单提交存在的问题 6 课程内容 6 1. 问题的引入 6 2. 问题的解决 6 参考进度(0.5课时) 7 第2讲 ...
- jQuery校验
jQuery校验 官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一导入js库 <script src=&q ...
- SSH实战 · AJAX异步校验
前台JS代码 /*异步验证用户名的输入格式以及是否存在*/ function CheckUsername(){ /*取到用户名输入框*/ var nametxt = documen ...
随机推荐
- 碰到故障大全---cd
office已安装32位,无法安装64位?解决方案:开始→运行→输入regedit,打开注册表编辑器,找到HKEY_CLASSES_ROOT\\Installer\\Products\ \000021 ...
- 老生常谈：vim 配置
1.自动补全 插件名字:NeoComplCache 下载地址:http://www.vim.org/scripts/script.php?script_id=2620 配置:把文件直接复制到vimfi ...
- python三大神器之virtualenv pip, virtualenv, fabric通称为pythoner的三大神器。
python三大神器之virtualenv pip, virtualenv, fabric通称为pythoner的三大神器. virtualenv virtualenv------用来建立一个虚拟 ...
- java- 综合实例-增删查改查，删除多项，分页，令牌机制
重点内容:分页.令牌机制(重定向下防止重复提交).使用c3p0连接数据库(以及数据库连接类) 项目结构: 类: 项目展示: 数据库: /* SQLyog Ultimate v12.09 (64 bit ...
- Laravel Debugbar
Installation Require this package with composer: composer require barryvdh/laravel-debugbar After up ...
- SpringMVC拦截器简单使用
一.拦截器的配置 1.传统的配置 Xml代码 <bean class="org.springframework.web.servlet.mvc.annotation.Default ...
- 使用html2canvas实现超出浏览器部分截图
之前写过一篇关于 html2canvas如何在元素隐藏的情况下生成截图 的文章,后面发现还有个坑在等着我,就是如果合成图片太大,超出了浏览器的可视区域,那么超出部分是无法截图的.在网上找到了以下方法, ...
- css鼠标移动到文字上怎样变化背景颜色
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- R笔记4：ggplot绘制商务图表--玫瑰图
我们说Excel有难度的图表,可以考虑ggplot2是否更方便,本帖的例子就是用ggplot做玫瑰图. Excel做玫瑰图有一定难度,可以使用雷达图或圆环图来构建,我的博客上曾有多个帖子讨论这个,见 ...
- msysgit使用方法
安装好后运行"Git Bash",出现命令框. 输入 ssh-keygen -t rsa -C “your_email@youremail.com” 会提示SSH Public K ...