基于jQuery实现Ajax验证用户名是否存在实例


Posted in Javascript onMarch 30, 2016

本文章向大家分享基于jQuery实现的Ajax 验证用户名是否存在的实现代码,需要的码农朋友可以参考一下本文的源代码。

jQuery.ajax概述

HTTP 请求加载远程数据。

通过jQuery 底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该对象,但特殊情况下可用于手动终止请求。

$.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息。详细参数选项见下。
注意: 如果你指定了 dataType 选项,请确保服务器返回正确的 MIME 信息,(如 xml 返回 "text/xml")。错误的 MIME 类型可能导致不可预知的错误。

注意:如果dataType设置为"script",那么在远程请求时(不在同一个域下),所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)
jQuery 1.2 中,您可以跨域加载 JSON 数据,使用时需将数据类型设置为 JSONP。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。数据类型设置为 "jsonp" 时,jQuery 将自动调用回调函数。

参数列表:

基于jQuery实现Ajax验证用户名是否存在实例

基于jQuery实现Ajax验证用户名是否存在实例

基于jQuery实现Ajax验证用户名是否存在实例

这里有几个Ajax事件参数:beforeSend ,success ,complete ,error 。我们可以定义这些事件来很好的处理我们的每一次的Ajax请求。注意一下,这些Ajax事件里面的 this 都是指向Ajax请求的选项信息的(请参考说 get() 方法时的this的图片)。
请认真阅读上面的参数列表,如果你要用jQuery来进行Ajax开发,那么这些参数你都必需熟知的。
实例:

1、请求页面AJax.aspx

HTML代码

<div> 
<input id="txtName" type="text" /><input type="button" value="查看用户名是否存在" id="btn" onclick="JudgeUserName();" /> 
<div id="showResult" style="float:left">div> 
div>

 JS代码

<script type="text/javascript" src="CSS/jquery-1.3.2.js"></script> 
<script type="text/javascript"> 
function JudgeUserName() 
{ 
$.ajax({ 
type:"GET", 
url:"AjaxUserInfoModify.aspx", 
dataType:"html", 
data:"userName="+$("#txtName").val(), 
beforeSend:function(XMLHttpRequest) 
{ 
$("#showResult").text("正在查询"); 
//Pause(this,100000); 
}, 
success:function(msg) 
{ 
$("#showResult").html(msg); 
$("#showResult").css("color","red"); 
}, 
complete:function(XMLHttpRequest,textStatus) 
{ 
//隐藏正在查询图片 
}, 
error:function() 
{ 
//错误处理 
} 
}); 
} 
</script>

2 、页面AjaxUserInfoModify.aspx

后台代码

protected void Page_Load(object sender, EventArgs e) 
{ 
string userName = Request.QueryString["userName"].ToString (); 
if (userName == "James Hao") 
{ 
Response.Write ("用户名已经存在!"); 
} 
else 
{ 
Response.Write ("您可以使用此用户名!"); 
} 
}

以上就是本文的全部内容,希望对大家的学习有所帮助。

Javascript 相关文章推荐
jquery仿QQ商城带左右按钮控制焦点图片切换滚动效果
Jun 27 Javascript
基于jQuery实现以手风琴方式展开和折叠导航菜单
Jan 28 Javascript
JavaScript中使用数组方法汇总
Feb 16 Javascript
BootStrap 智能表单实战系列(十)自动完成组件的支持
Jun 13 Javascript
jQuery实现checkbox列表的全选、反选功能
Nov 24 Javascript
仿京东快报向上滚动的实例
Dec 13 Javascript
vue.js简单配置axios的方法详解
Dec 13 Javascript
vue 动态改变静态图片以及请求网络图片的实现方法
Feb 07 Javascript
vue addRoutes实现动态权限路由菜单的示例
May 15 Javascript
4个顶级开源JavaScript图表库
Sep 29 Javascript
javascript 关于赋值、浅拷贝、深拷贝的个人理解
Nov 01 Javascript
vant组件中 dialog的确认按钮的回调事件操作
Nov 04 Javascript
jQuery表格插件datatables用法汇总
Mar 29 #Javascript
基于javascript实现tab切换特效
Mar 29 #Javascript
基于javascript实现简单的抽奖系统
Apr 15 #Javascript
基于javascript实现九宫格大转盘效果
May 28 #Javascript
全屏js头像上传插件源码高清版
Mar 29 #Javascript
js闭包引起的事件注册问题介绍
Mar 29 #Javascript
使用postMesssage()实现跨域iframe页面间的信息传递方法
Mar 29 #Javascript
You might like
解析php中获取url与物理路径的总结
2013/06/21 PHP
php常用数组array函数实例总结【赋值,拆分,合并,计算,添加,删除,查询,判断,排序】
2016/12/07 PHP
Eclipse引入jquery报错如何解决
2015/12/01 Javascript
js实现仿qq消息的弹出窗效果
2016/01/06 Javascript
JavaScript设计模式初探
2016/01/07 Javascript
基于javascript简单实现对身份证校验
2021/01/25 Javascript
基于jquery实现无限级树形菜单
2016/03/22 Javascript
实用又漂亮的BootstrapValidator表单验证插件
2016/05/30 Javascript
jQuery的ajax中使用FormData实现页面无刷新上传功能
2017/01/16 Javascript
学习使用Bootstrap页面排版样式
2017/05/11 Javascript
微信小程序授权获取用户详细信息openid的实例详解
2017/09/20 Javascript
jQuery实现常见的隐藏与展示列表效果示例
2018/06/04 jQuery
JavaScript常用事件介绍
2019/01/21 Javascript
微信小程序实现多张图片上传功能
2020/11/18 Javascript
python实现搜索指定目录下文件及文件内搜索指定关键词的方法
2015/06/28 Python
python交互式图形编程实例(一)
2017/11/17 Python
numpy中实现二维数组按照某列、某行排序的方法
2018/04/04 Python
python爱心表白 每天都是浪漫七夕!
2018/08/18 Python
解决python3 pika之连接断开的问题
2018/12/18 Python
简单了解python gevent 协程使用及作用
2019/07/22 Python
浅谈Python3中print函数的换行
2020/08/05 Python
Nuts.com:优质散装,批发坚果、干果和巧克力等
2017/03/21 全球购物
Tirendo比利时:在线购买轮胎
2018/10/22 全球购物
智能室内花园:Click & Grow
2021/01/29 全球购物
瑞士男士时尚网上商店:Babista
2020/05/14 全球购物
网络教育自我鉴定
2013/11/01 职场文书
施工资料员岗位职责
2014/01/06 职场文书
幼儿园新学期寄语
2014/01/18 职场文书
企业法人授权委托书
2014/04/03 职场文书
个性婚礼策划方案
2014/05/17 职场文书
预备党员学习十八届三中全会精神思想汇报
2014/09/13 职场文书
公证书
2019/04/17 职场文书
Django模型层实现多表关系创建和多表操作
2021/07/21 Python
用JS创建一个录屏功能
2021/11/11 Javascript
Python中的协程(Coroutine)操作模块(greenlet、gevent)
2022/05/30 Python
Redis keys命令的具体使用
2022/06/05 Redis