基于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实现跟随鼠标移动且带关闭功能的图片广告实例
Feb 26 Javascript
纯javascript实现简单下拉刷新功能
Mar 13 Javascript
JQuery中两个ul标签的li互相移动实现方法
May 18 Javascript
javascript结合Flexbox简单实现滑动拼图游戏
Feb 18 Javascript
封装获取dom元素的简单实例
Jul 08 Javascript
JavaScript 动态三角函数实例详解
Jan 08 Javascript
js实现自定义进度条效果
Mar 15 Javascript
说说如何在Vue.js中实现数字输入组件的方法
Jan 08 Javascript
VUE解决微信签名及SPA微信invalid signature问题(完美处理)
Mar 29 Javascript
vue项目强制清除页面缓存的例子
Nov 06 Javascript
openlayers实现图标拖动获取坐标
Sep 25 Javascript
基于vue的video播放器的实现示例
Feb 19 Vue.js
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中usort在值相同时改变原始位置问题的解决方法
2011/11/27 PHP
PHP模块memcached使用指南
2014/12/08 PHP
PHP处理CSV表格文件的常用操作方法总结
2016/07/01 PHP
php 判断过去离现在几年的函数(实例代码)
2016/11/15 PHP
php中get_object_vars()在数组的实例用法
2021/02/22 PHP
js汉字排序问题 支持中英文混排,兼容各浏览器,包括CHROME
2011/12/20 Javascript
基于jQuery捕获超链接事件进行局部刷新代码
2012/05/10 Javascript
Jquery选择子控件&quot;大于号&quot;和&quot; &quot;区别介绍及使用示例
2013/06/25 Javascript
方便实用的jQuery checkbox复选框全选功能简单实例
2013/10/09 Javascript
js 操作符汇总
2014/11/08 Javascript
让javascript加载速度倍增的方法(解决JS加载速度慢的问题)
2014/12/12 Javascript
jQuery实现搜索页面关键字的功能
2017/02/16 Javascript
websocket+node.js实现实时聊天系统问题咨询
2017/05/17 Javascript
微信小程序左右滑动的实现代码
2017/12/15 Javascript
Nuxt.js开启SSR渲染的教程详解
2018/11/30 Javascript
CryptoJS中AES实现前后端通用加解密技术
2018/12/18 Javascript
在vue中使用echars实现上浮与下钻效果
2019/11/08 Javascript
vue 在单页面应用里使用二级套嵌路由
2020/12/19 Vue.js
python条件和循环的使用方法
2013/11/01 Python
简单介绍使用Python解析并修改XML文档的方法
2015/10/15 Python
Python3连接MySQL(pymysql)模拟转账实现代码
2016/05/24 Python
Python代码实现KNN算法
2017/12/20 Python
Python爬虫PyQuery库基本用法入门教程
2018/08/04 Python
解决Pyinstaller 打包exe文件 取消dos窗口(黑框框)的问题
2019/06/21 Python
使用python分析统计自己微信朋友的信息
2019/07/19 Python
Pytorch 中retain_graph的用法详解
2020/01/07 Python
Python with标签使用方法解析
2020/01/17 Python
用Python生成HTML表格的方法示例
2020/03/06 Python
jupyter notebook读取/导出文件/图片实例
2020/04/16 Python
python pymysql链接数据库查询结果转为Dataframe实例
2020/06/05 Python
pytorch中的weight-initilzation用法
2020/06/24 Python
One.com挪威:北欧成长最快的网络托管公司
2016/11/19 全球购物
阿迪达斯越南官网:adidas越南
2020/07/19 全球购物
2015元旦联欢晚会结束语
2014/12/14 职场文书
公司感谢信范文
2015/01/22 职场文书
杭州西湖英语导游词
2015/02/03 职场文书