基于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 相关文章推荐
纯js实现瀑布流展现照片(自动适应窗口大小)
Apr 08 Javascript
利用Angularjs和Bootstrap前端开发案例实战
Aug 27 Javascript
jQuery.Ajax()的data参数类型详解
Jul 23 jQuery
javascript+css3开发打气球小游戏完整代码
Nov 28 Javascript
Vue2.0学习之详解Vue 组件及父子组件通信
Dec 12 Javascript
谈谈vue中mixin的一点理解
Dec 12 Javascript
将Sublime Text 3 添加到右键中的简单方法
Dec 12 Javascript
Vue 实现树形视图数据功能
May 07 Javascript
layui框架table 数据表格的方法级渲染详解
Aug 19 Javascript
微信公众号获取用户地理位置并列出附近的门店的示例代码
Jul 25 Javascript
15 分钟掌握vue-next响应式原理
Oct 13 Javascript
JS实现公告上线滚动效果
Jan 10 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
UCenter 批量添加用户的php代码
2012/07/17 PHP
codeigniter上传图片不能正确识别图片类型问题解决方法
2014/07/25 PHP
Smarty日期时间操作方法示例
2016/11/15 PHP
php实现的生成排列算法示例
2019/07/25 PHP
jQuery数组处理方法汇总
2011/06/20 Javascript
二叉树的非递归后序遍历算法实例详解
2014/02/07 Javascript
jQuery实现验证年龄简单思路
2016/02/24 Javascript
第十章之巨幕页头缩略图与警告框组件
2016/04/25 Javascript
JS动态给对象添加事件的简单方法
2016/07/19 Javascript
jQuery+ajax读取并解析XML文件的方法
2016/09/09 Javascript
JavaScript中for循环的几种写法与效率总结
2017/02/03 Javascript
Vue 2.x教程之基础API
2017/03/06 Javascript
Angular 4依赖注入学习教程之FactoryProvider配置依赖对象(五)
2017/06/04 Javascript
微信小程序开发之map地图实现教程
2017/06/08 Javascript
Vue2.0+ElementUI实现表格翻页的实例
2017/10/23 Javascript
详解vue-router 命名路由和命名视图
2018/06/01 Javascript
[03:27]最受玩家喜爱奖提名:PZH_Element 致玩家寄语
2016/12/20 DOTA
python对字典进行排序实例
2014/09/25 Python
在Python中操作列表之List.pop()方法的使用
2015/05/21 Python
Python基于pygame实现的font游戏字体(附源码)
2015/11/11 Python
Python数据结构与算法之字典树实现方法示例
2017/12/13 Python
Django时区详解
2019/07/24 Python
Python实现TCP探测目标服务路由轨迹的原理与方法详解
2019/09/04 Python
python 截取XML中bndbox的坐标中的图像,另存为jpg的实例
2020/03/10 Python
python实现批量修改文件名
2020/03/23 Python
Opencv python 图片生成视频的方法示例
2020/11/18 Python
使用phonegap获取位置信息的实现方法
2017/03/31 HTML / CSS
Algenist奥杰尼官网:微藻抗衰老护肤品牌
2017/07/15 全球购物
美国狗旅行和户外用品领先供应商:kurgo
2020/08/18 全球购物
预备党员思想汇报范文
2014/01/11 职场文书
科研课题实施方案
2014/03/18 职场文书
敬老院活动总结
2014/04/28 职场文书
公司运动会策划方案
2014/05/25 职场文书
我的梦想演讲稿500字
2014/08/21 职场文书
反四风对照检查材料思想汇报
2014/09/16 职场文书
Redis性能监控的实现
2021/07/09 Redis