基于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 ("您可以使用此用户名！");
}
}

3 、运行界面

(1)初始化界面

（2）正在查询提示页面

（3） 验证用户名已经存在页面

（4）  验证用户名未存在页面

至此 AJAX验证用户名是否存在的功能已经完成。

赞 (0)

相关推荐

  • S2SH整合JQuery+Ajax实现登录验证功能实现代码

    不多说了,上码 action 复制代码 代码如下: package com.lk.action; import javax.annotation.Resource; import com.googlecode.jsonplugin.annotations.JSON; import com.lk.service.StudentControl; import com.opensymphony.xwork2.ActionSupport; public class LoginAjaxAction ext

  • jquery+ajax验证不通过也提交表单问题处理

    validationEngine给我们为前端的表单验证减少了很大的工作量.大部分情况我们使用validationEngine验证表单的形式有几种方式: 1 使用正常的表单提交.这种情况validationEngine验证不通过是不会提交表单的. 2 使用ajax提交表单,但是没有使用ajax验证. 这种方式也比较简单,在我们使用ajax请求前检查验证是否通过就可以,例如: 复制代码 代码如下: //验证不通过时return      if(!$("form#ajaxForm").val

  • 基于jQuery实现的Ajax 验证用户名唯一性实例代码

    基于jQuery实现的Ajax 验证用户名唯一性实例代码

    JSP部分代码: <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <%@include file="/common/header.jsp"%> <title>用户管理</title> <script type="text/javascript&quo

  • ASP.NET中实现jQuery Validation-Engine的Ajax验证实现代码

    ASP.NET中实现jQuery Validation-Engine的Ajax验证实现代码

    见下图: 验证的例子:http://www.position-relative.net/creation/formValidator/ 官方地址: http://www.position-absolute.com/articles/jquery-form-validator-because-form-validation-is-a-mess/ 这个插件支持大部分的浏览器,但由于有使用到了css3的阴影和圆角样式,所以在IE浏览器下无法看到圆角和阴影效果(IE 9 支持圆角效果). 本文主要内容是

  • jquery validate和jquery form 插件组合实现验证表单后AJAX提交

    要实现表单验证和无刷新提交表单我们可以使用jQuery的两个很好用的插件--jquery validate.js 和 jquery form.js.具体详细说明情况下文. 1.jQuery validate.js,它说白了就是一个很高尚的人为我们写好了各种表单的验证,不用我们这些童鞋去现写了,一天天的多累啊,呵呵. 2.jQuery form.js,"这个插件能够让你简洁的将以HTML形式提交的表单升级成采用AJAX技术提交的表单. 插件里面主要的方法, ajaxForm 和 ajaxSubmi

  • jQuery+AJAX实现遮罩层登录验证界面（附源码）

    jQuery+AJAX实现遮罩层登录验证界面（附源码）

    JQuery遮罩层登录界面效果的实现,AJAX实现登录验证,文章尾有完整示例源码下载,欢迎大家学习研究. 操作系统:Windwos7 Ultimate 开发工具:Visual Studio 2010 数据库:Sql Server 2005 测试浏览器:IE8.FF3.6.8.Google Chrome (IE8中弹出登录层后会出现竖拉条,其他两种没有出现,那个竖拉条可以在JS中通过修改数值让其不出现,但是下面会出现白边,越来越觉得IE有点那个了......) 1.预览 1)登录前 2)点击登录显

  • 基于jQuery实现的Ajax 验证用户名是否存在的实现代码

    基于jQuery实现的Ajax 验证用户名是否存在的实现代码

    实例: 1.请求页面AJax.aspx HTML代码 复制代码 代码如下: <div> <input id="txtName" type="text" /><input type="button" value="查看用户名是否存在" id="btn" onclick="JudgeUserName();" /> <div id="show

  • ajax验证用户名和密码的实例代码

    本文实例为大家介绍了ajax验证用户名和密码的具体代码,供大家参考,具体内容如下 1.ajax主体部分 var xmlrequest; function createXMLHttpRequest(){ if(window.XMLHttpRequest){ xmlrequest=new XMLHttpRequest(); } else if(window.ActiveXObject){ try{ xmlrequest=new ActiveXObject("Msxm12.XMLHTTP")

  • Ajax验证用户名是否存在的实例代码

    jsp页面 <head> <script type="text/javascript" src="js/register.js"></script> </head> <table> <td>用户名:</td> <td> <input type="text" name="r_name" id="r_name"

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

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

    本文章向大家分享基于jQuery实现的Ajax 验证用户名是否存在的实现代码,需要的码农朋友可以参考一下本文的源代码. jQuery.ajax概述 HTTP 请求加载远程数据. 通过jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象.大多数情况下你无需直接操作该对象,但特殊情况下可用于手动终止请求. $.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息.详

  • 基于jQuery实现Ajax验证用户名是否可用实例

    本文实例为大家分享了jQuery ajax简单案例-验证用户名是否可用的具体代码,供大家参考,具体内容如下 HTML <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="/jquery_aj

  • ASP.NET中实现jQuery Validation-Engine的Ajax验证

    ASP.NET中实现jQuery Validation-Engine的Ajax验证

    见下图: 验证的例子:http://www.position-relative.net/creation/formValidator/ 官方地址: http://www.position-absolute.com/articles/jquery-form-validator-because-form-validation-is-a-mess/ 这个插件支持大部分的浏览器,但由于有使用到了css3的阴影和圆角样式,所以在IE浏览器下无法看到圆角和阴影效果(IE 9 支持圆角效果). 本文主要内容是

  • 基于Jquery.history解决ajax的前进后退问题

    以下内容是关于Jquery.history解决ajax的前进后退问题,具体详情请看下文. 本文的前提是基于后台的,所以这里不会考虑seo的问题.同时,基于后台的管理系统,也不需要被收藏,所以也不会考虑刷新的这种类似直接敲网址的情况!!! 这里使用的是html5中的history.state 来解决. 网上已经有了js的开源解决方案pushState.详见pjax 但是这个方案不适合我的项目(后台项目),尤其是主要的方法有点不够用. 我使用的是  jquery.history.js  可以参考这个

  • 基于Jquery实现表单验证

    有时在我们注册账户.登陆系统时,当所有验证通过方可提交 这就需要Jquery来实现表单验证,今天分享给小伙伴们一段基于Jquery实现表单验证的代码. <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>Reg</title> <style> .state1{ color

随机推荐