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 相关文章推荐
动态表格Table类的实现
Aug 26 Javascript
setTimeout和setInterval的区别你真的了解吗?
Mar 31 Javascript
jquery如何改变html标签的样式(两种实现方法)
Jan 16 Javascript
cookie的复制与使用记住用户名实现代码
Nov 04 Javascript
jquery单行文字向上滚动效果的实现代码
Sep 05 Javascript
jquery  实现轮播图详解及实例代码
Oct 12 Javascript
js/jq仿window文件夹移动/剪切/复制等操作代码
Mar 08 Javascript
JS路由跳转的简单实现代码
Sep 21 Javascript
javascript input输入框模糊提示功能的实现
Sep 25 Javascript
微信小程序实现获取自己所处位置的经纬度坐标功能示例
Nov 30 Javascript
vue2.x数组劫持原理的实现
Apr 19 Javascript
如何利用JavaScript编写更好的条件语句详解
Aug 10 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
PHP包含文件函数include、include_once、require、require_once区别总结
2014/04/05 PHP
CentOS 上搭建 PHP7 开发测试环境
2017/02/26 PHP
读jQuery之一(对象的组成)
2011/06/11 Javascript
jquery Moblie入门—hello world的示例代码学习
2013/01/08 Javascript
jquery操作 iframe的方法
2014/12/03 Javascript
javascript 操作符(~、&amp;、|、^、)使用案例
2014/12/31 Javascript
详解Angularjs中的依赖注入
2016/03/11 Javascript
基于AngularJs + Bootstrap + AngularStrap相结合实现省市区联动代码
2016/05/30 Javascript
jquery popupDialog 使用 加载jsp页面的方法
2016/10/25 Javascript
微信小程序中做用户登录与登录态维护的实现详解
2017/05/17 Javascript
jQuery操作之效果详解
2017/05/19 jQuery
node前端模板引擎Jade之标签的基本写法
2018/05/11 Javascript
微信小程序实现发送验证码按钮效果
2018/12/20 Javascript
es6中class类静态方法,静态属性,实例属性,实例方法的理解与应用分析
2020/02/15 Javascript
浅谈Python中的闭包
2015/07/08 Python
python web基础之加载静态文件实例
2018/03/20 Python
Python图像处理之识别图像中的文字(实例讲解)
2018/05/10 Python
Python面向对象之Web静态服务器
2019/09/03 Python
django实现支付宝支付实例讲解
2019/10/17 Python
Python的形参和实参使用方式
2019/12/24 Python
Pytorch maxpool的ceil_mode用法
2020/02/18 Python
Python序列化pickle模块使用详解
2020/03/05 Python
Python调用ffmpeg开源视频处理库,批量处理视频
2020/11/16 Python
Python实现小黑屋游戏的完整实例
2021/01/06 Python
使用分层画布来优化HTML5渲染的教程
2015/05/08 HTML / CSS
纽约州一群才华横溢的金匠制作而成:Hearth Jewelry
2019/03/22 全球购物
简单说下OSPF的操作过程
2014/08/13 面试题
党员批评与自我批评
2014/10/15 职场文书
学习十八届四中全会精神思想汇报
2014/10/23 职场文书
2014年六五普法工作总结
2014/11/25 职场文书
公务员政审个人总结
2015/02/12 职场文书
幼儿园百日安全活动总结
2015/05/07 职场文书
2015年超市工作总结范文
2015/05/26 职场文书
JavaScript最完整的深浅拷贝实现方式详解
2022/02/28 Javascript
SpringCloud Feign请求头删除修改的操作代码
2022/03/20 Java/Android
mysql中关键词exists的用法实例详解
2022/06/10 MySQL