jquery ajax 检测用户注册时用户名是否存在


Posted in Javascript onNovember 03, 2009

首先需要一个添加年级的页面,暂时叫grade.htm
这个文件需要引入两个文件jquery.js(jquery框架文件)和grade.js(验证的单独文件)。
下面的input用于输入用户名字,id="gradeInfo"是为了显示提示信息用的。
grade.htm

<input type="text" size="6" name="NAME" id="NAME"/><font color="red">*</font> 
<span id="gradeInfo"></span>

当用户输入信息以后,进入验证环节,看看我们的验证grade.js是怎么写的。
grade.js
/** 
* 验证用户名是否重复的js 
* 
* @name grade.js 
* @author jason<msn:x334@eyou.com> 
* @use 验证用户名是否存在 
* @todo 
*/ 
$(document).ready(function(){ 
checkConfirm(); 
}); 
//验证用户名是否存在 
function checkConfirm(){ 
$("#NAME").blur(function(){ 
var gradename = $(this).val(); 
var changeUrl = "GradeAdmin.php?action=check&gradename="+gradename; 
$.get(changeUrl,function(str){ 
if(str == '1'){ 
$("#gradeInfo").html("<font color=\"red\">您输入的用户名存在!请重新输入!</font>"); 
}else{ 
$("#gradeInfo").html(""); 
} 
}) 
return false; 
}) 
}

上面这段js文件,我只解释几个比较关键的地方。
1、$("#NAME").blur的含义是当grade.htm里的id为NAME的表单输入完以后触发动作。
2、$(this).val()的含义是取得id为NAME的表单里的值。
3、$.get(changeUrl,function(str)的含义是:运行ajax后,changeUrl是要连接的程序地址,str是程序
计算结束以后得到的显示结构。
4、$("#gradeInfo").html的含义是给id为gradeInfo的标签写入html文件。id为gradeInfo的标签就是指
的grade.htm里的id为gradeInfo的标签,显示的内容会出现再这个标签所在的位置。
再看看GradeAdmin.php的计算形式。
GradeAdmin.php
复制代码
if($frm_action == 'check') 
{ 
$gradeName = $_GET['gradename']; 
$gradeAdminObj = new Services_GradeAdmin($db); 
//根据$gradeName去判断是否再数据库里存在填入的用户名字,如果存在返回1,如果 
不存在返回0,这个返回值是传到grade.js里。 
$gradeCheck = $gradeAdminObj->getGradeByName($gradeName); 
if(is_numeric($gradeCheck)){ 
echo '1'; 
}else{ 
echo '0'; 
} 
exit(); 
}

这就是判断用户注册时用户名是否已存在问题
Javascript 相关文章推荐
js 新浪的一个图片播放图片轮换效果代码
Jul 15 Javascript
基于Jquery实现键盘按键监听
May 11 Javascript
jQuery $命名冲突解决方案汇总
Nov 13 Javascript
JavaScript事件委托实例分析
May 26 Javascript
jQuery实现ctrl+enter(回车)提交表单
Oct 19 Javascript
jquery+ajax+text文本框实现智能提示完整实例
Jul 09 Javascript
Vue.js 父子组件通讯开发实例
Sep 06 Javascript
基于javascript实现按圆形排列DIV元素(一)
Dec 02 Javascript
jQuery读取XML文件的方法示例
Feb 03 Javascript
layui table 多行删除(id获取)的方法
Sep 12 Javascript
Vue 嵌套路由使用总结(推荐)
Jan 13 Javascript
JS前端面试必备——基本排序算法原理与实现方法详解【插入/选择/归并/冒泡/快速排序】
Feb 24 Javascript
基于JQuery框架的AJAX实例代码
Nov 03 #Javascript
Jquery AJAX 框架的使用方法
Nov 03 #Javascript
JQuery打造PHP的AJAX表单提交实例
Nov 03 #Javascript
jQuery get和post 方法传值注意事项
Nov 03 #Javascript
js window.onload 加载多个函数的方法
Nov 02 #Javascript
深入认识javascript中的eval函数
Nov 02 #Javascript
javascript 按回车键相应按钮提交事件
Nov 02 #Javascript
You might like
DC《小丑》11项提名领跑奥斯卡 Netflix成第92届奥斯卡提名最大赢家
2020/04/09 欧美动漫
解析用PHP读写音频文件信息的详解(支持WMA和MP3)
2013/05/10 PHP
php单例模式的简单实现方法
2016/06/10 PHP
PHP魔术方法之__call与__callStatic使用方法
2017/07/23 PHP
Laravel中使用Queue的最基本操作教程
2017/12/27 PHP
PHP cURL获取微信公众号access_token的实例
2018/04/28 PHP
实例讲解PHP验证邮箱是否合格
2019/01/28 PHP
让iframe自适应高度(支持XHTML,支持FF)
2007/07/24 Javascript
jQuery使用一个按钮控制图片的伸缩实现思路
2013/04/19 Javascript
基于JavaScript实现继承机制之构造函数方法对象冒充的使用详解
2013/05/07 Javascript
js 得到文件后缀(通过正则实现)
2013/07/08 Javascript
node.js中的path.extname方法使用说明
2014/12/09 Javascript
text-align:justify实现文本两端对齐 兼容IE
2015/08/19 Javascript
nodejs操作mongodb的填删改查模块的制作及引入实例
2018/01/02 NodeJs
JS/HTML5游戏常用算法之碰撞检测 像素检测算法实例详解
2018/12/12 Javascript
jQuery操作动画完整实例分析
2020/01/10 jQuery
Vue实现简单的跑马灯
2020/05/25 Javascript
jQuery实现B2B网站后台管理系统侧导航
2020/07/08 jQuery
让Vue响应Map或Set的变化操作
2020/11/11 Javascript
编写同时兼容Python2.x与Python3.x版本的代码的几个示例
2015/03/30 Python
八大排序算法的Python实现
2021/01/28 Python
Sanic框架请求与响应实例分析
2018/07/16 Python
Python一键查找iOS项目中未使用的图片、音频、视频资源
2019/08/12 Python
Python网络编程之使用TCP方式传输文件操作示例
2019/11/01 Python
Python restful框架接口开发实现
2020/04/13 Python
Python configparser模块常用方法解析
2020/05/22 Python
Python虚拟环境virtualenv创建及使用过程图解
2020/12/08 Python
html5组织文档结构_动力节点Java学院整理
2017/07/11 HTML / CSS
好药师网上药店:安全合法的网上药品零售药房
2017/02/15 全球购物
印度购买眼镜和太阳镜网站:Coolwinks
2018/09/26 全球购物
领导班子群众路线与四风问题对照检查材料思想汇报
2014/10/11 职场文书
付款证明模板
2015/06/19 职场文书
拿破仑传读书笔记
2015/07/01 职场文书
Golang 切片(Slice)实现增删改查
2022/04/22 Golang
Window server 2012 R2 AD域的组策略相关设置
2022/04/28 Servers
Windows Server 2019 安装DHCP服务及相关配置
2022/04/28 Servers