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 相关文章推荐
基于jquery的用鼠标画出可移动的div
Sep 06 Javascript
css样式标签和js语法属性区别
Nov 06 Javascript
js兼容火狐获取图片宽和高的方法
May 21 Javascript
JS实现1000以内被3或5整除的数字之和
Feb 18 Javascript
Bootstrap每天必学之轮播(Carousel)插件
Apr 25 Javascript
JavaScript知识点总结(十六)之Javascript闭包(Closure)代码详解
May 31 Javascript
javascript作用域、作用域链(菜鸟必看)
Jun 16 Javascript
js 提交form表单和设置form表单请求路径的实现方法
Oct 25 Javascript
jQuery的$.extend 浅拷贝与深拷贝
Mar 08 Javascript
AngularJS 多指令Scope问题的解决
Oct 25 Javascript
JS正则表达式验证密码强度
Mar 18 Javascript
解决vue中axios设置超时(超过5分钟)没反应的问题
Sep 04 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
五款常用mysql slow log分析工具的比较分析
2011/05/22 PHP
PHP中strtr字符串替换用法详解
2014/11/26 PHP
PHP的HTTP客户端Guzzle简单使用方法分析
2019/10/30 PHP
Jquery读取URL参数小例子
2013/08/30 Javascript
JavaScript移除数组元素减少长度的方法
2013/09/05 Javascript
jquery实现table鼠标经过变色代码
2013/09/25 Javascript
js取消单选按钮选中并判断对象是否为空
2013/11/14 Javascript
node.js中的fs.fchmodSync方法使用说明
2014/12/16 Javascript
JavaScript实现模仿桌面窗口的方法
2015/07/18 Javascript
Vuejs第十二篇之动态组件全面解析
2016/09/09 Javascript
jquery.form.js异步提交表单详解
2017/04/25 jQuery
基于JavaScript 性能优化技巧心得(分享)
2017/12/11 Javascript
vue响应式系统之observe、watcher、dep的源码解析
2019/04/09 Javascript
原生js实现抽奖小游戏
2019/06/27 Javascript
[11:44]Ti9 OG夺冠时刻
2019/08/25 DOTA
pyv8学习python和javascript变量进行交互
2013/12/04 Python
Python实现列表删除重复元素的三种常用方法分析
2017/11/24 Python
解决Django migrate No changes detected 不能创建表的问题
2018/05/27 Python
浅析Python 3 字符串中的 STR 和 Bytes 有什么区别
2018/10/14 Python
python-docx文件定位读取过程(尝试替换)
2020/02/13 Python
Python StringIO及BytesIO包使用方法解析
2020/06/15 Python
Selenium alert 弹窗处理的示例代码
2020/08/06 Python
python3实现语音转文字(语音识别)和文字转语音(语音合成)
2020/10/14 Python
python爬虫用scrapy获取影片的实例分析
2020/11/23 Python
python分布式爬虫中消息队列知识点详解
2020/11/26 Python
html5 桌面提醒:Notifycations应用介绍
2012/11/27 HTML / CSS
英国第一家领先的在线处方眼镜零售商:Glasses Direct
2018/02/23 全球购物
澳大利亚领先的在线机械五金、园艺和存储专家:Edisons
2018/03/24 全球购物
EM Cosmetics官网:由彩妆大神Michelle Phan创办的独立品牌
2020/04/27 全球购物
远程网络教育毕业生自我鉴定
2014/04/14 职场文书
复兴之路展览观后感
2015/06/02 职场文书
机械生产实习心得体会
2016/01/22 职场文书
2016年学校“6﹒26国际禁毒日”宣传活动总结
2016/04/05 职场文书
python 模拟在天空中放风筝的示例代码
2021/04/21 Python
Mysql关于数据库是否应该使用外键约束详解说明
2021/10/24 MySQL
vue elementUI批量上传文件
2022/04/26 Vue.js