您的位置:首页 > 其它

利用Ajax检测帐户是否存在.

2008-06-30 19:37 344 查看
为不刷新页面,检测输入的用户名是否已经注册,示例如下:

脚本如下:

/*--------------------------------------

Name:AJAXRequest

Version:0.8.06

Author:xujiwei

E-mail:vipxjw@163.com

Website:http://www.xujiwei.cn/
License:http://www.gnu.org/licenses/gpl.htmlGPL

Copyright(c)2006-2008,xujiwei,AllRightsReserved

AjaxRequestDeveoperManual:
http://ajax.xujiwei.cn/
--------------------------------------*/

/**

*AJAXRequest类

*@author	xujiwei

*@constructor

*@class		AJAXRequest

*@param		{Object}	[initObj]	初始化参数对象

*@param		{String}	[initObj.url=""]			要请求的Url

*@param		{String}	[initObj.content=""]		要发送的内容

*@param		{String}	[initObj.method="GET"]		请求方法,GET或

POST

*@param		{String}	[initObj.charset]			发送数据时使

用的编码

*@param		{Boolean}	[initObj.async=true]		请求类型,true为异

步,false为同步

*@param		{Number}	[initObj.timeout=3600000]	请求超时时间,单位为

毫秒

*@param		{function}	[initObj.ontimeout]			请求超时时的

回调函数

*@param		{function}	[initObj.onrequeststart]		请求开始时的

回调函数

*@param		{function}	[initObj.onrequestend]		请求结束时的回调函数

*@param		{function}	[initObj.oncomplete]		请求正确完成时的回调

函数

*@param		{function}	[initObj.onexception]		请求发生异常时的回调

函数

*@property	{String}	url			要请求的Url

*@property	{String}	content		要发送的内容

*@property	{String}	method		请求方法,GET或POST

*@property	{String}	charset		发送数据时使用的编码

*@property	{Boolean}	async		请求类型,true为异步,false为同步

*@property	{Number}	timeout		请求超时时间,单位为毫秒

*@property	{function}	ontimeout	请求超时时的回调函数

*@property	{function}	onrequeststart	请求开始时的回调函数

*@property	{function}	onrequestend	请求结束时的回调函数

*@property	{function}	oncomplete	请求正确完成时的回调函数

*@property	{function}	onexception	请求发生异常时的回调函数

*@example

*varajax1=newAJAXRequest();

*varajax2=newAJAXRequest({

*	url:"getdata.asp",	//从getdata.asp获取数据

*	method:"GET",		//GET方式

*	oncomplete:function(obj){

*		alert(obj.responesText);	//显示getdata.asp输出的内容

*});

*/

functionAJAXRequest(){

varxmlPool=[],objPool=[],AJAX=this,ac=arguments.length,av=arguments;

varxmlVersion=["MSXML2.XMLHTTP","Microsoft.XMLHTTP"];

varec=emptyFun=function(){};

av=ac>0?typeof(av[0])=="object"?av[0]:{}:{};

varencode=$GEC(av.charset+"");

varprop=

['url','content','method','async','timeout','ontimeout','onrequeststart','onrequestend','onc

omplete','onexception'];

vardefval=['','','GET',true,3600000,ec,ec,ec,ec,ec],l=prop.length;

while(l--){this[prop[l]]=getp(av[prop[l]],defval[l]);}

if(!getObj())returnfalse;

functiongetp(p,d){returnp!=undefined?p:d;}

functiongetObj(){

vari,j,tmpObj;

for(i=0,j=xmlPool.length;i<j;i++)if(xmlPool[i].readyState==0||xmlPool

[i].readyState==4)returnxmlPool[i];

try{tmpObj=newXMLHttpRequest;}

catch(e){

for(i=0,j=xmlVersion.length;i<j;i++){

try{tmpObj=newActiveXObject(xmlVersion[i]);}catch(e2){

continue;}

break;

}

}

if(!tmpObj)returnfalse;

else{xmlPool[xmlPool.length]=tmpObj;returnxmlPool[xmlPool.length-1];}

}

function$(id){returndocument.getElementById(id);}

function$N(d){varn=d*1;return(isNaN(n)?0:n);}

function$VO(v){return(typeof(v)=="string"?(v=$(v))?v:false:v);}

function$GID(){return((newDate)*1);}

function$SOP(id,ct){objPool[id+""]=ct;}

function$LOP(id){return(objPool[id+""]);}

function$SRP(f,r,p){return(function(s){s=f(s);for(vari=0;i<r.length;i++)

s=s.replace(r[i],p[i]);return(s);});}

function$GEC(cs){

if(cs.toUpperCase()=="UTF-8")return(encodeURIComponent);

elsereturn($SRP(escape,[//+/g],["%2B"]));

}

function$ST(obj,text){

varnn=obj.nodeName.toUpperCase();

if("INPUT|TEXTAREA|OPTION".indexOf(nn)>-1)obj.value=text;

elsetry{obj.innerHTML=text;}catch(e){};

}

function$CB(cb){

if(typeof(cb)=="function")returncb;

else{

cb=$VO(cb);

if(cb)return(function(obj){$ST(cb,obj.responseText);});

elsereturnthis.oncomplete;}

}

function$GP(p,v,d,f){

vari=0;

while(i<v.length){p[i]=v[i]?f[i]?f[i](v[i]):v[i]:d[i];i++;}

while(i<d.length){p[i]=d[i];i++;}

}

functionsend(purl,pc,pcbf,pm,pa){

varct,ctf=false,xmlObj=getObj(),ac=arguments.length,av=arguments;

if(!xmlObj)returnfalse;

varpmp=pm.toUpperCase()=="POST"?true:false;

if(!pm||!purl)returnfalse;

varev={url:purl,content:pc,method:pm};

purl+=(purl.indexOf("?")>-1?"&":"?")+"timestamp="+$GID();

xmlObj.open(pm,purl,pa);

AJAX.onrequeststart(ev);

if(pmp)xmlObj.setRequestHeader("Content-Type","application/x-www-form-

urlencoded");

ct=setTimeout(function(){ctf=true;xmlObj.abort();},AJAX.timeout);

varrc=function(){

if(ctf){AJAX.ontimeout(ev);AJAX.onrequestend(ev);}

elseif(xmlObj.readyState==4){

ev.status=xmlObj.status;

try{clearTimeout(ct);}catch(e){};

try{if(xmlObj.status==200)pcbf(xmlObj);else

AJAX.onexception(ev);}

catch(e){AJAX.onexception(ev);}

AJAX.onrequestend(ev);

}

}

xmlObj.onreadystatechange=rc;

if(pmp)xmlObj.send(pc);elsexmlObj.send("");

if(pa==false)rc();

returntrue;

}

/**

*设置发送请求时使用的编码

*@param	{String}	charset	编码名称,UTF-8或GB2312,或者其他

*@example

*varajax=newAJAXRequest();

*ajax.setcharset("GB2312");

*/

this.setcharset=function(cs){encode=$GEC(cs);}

/**

*使用GET方法请求指定的Url

*@param	{String}	[url]		要请求的Url

*@param	{function|Object|String}	[oncomplete]	正确返回时的回调函数

,或者要更新的对象,或者要更新对象的ID

*@example

*varajax=newAJAXRequest();

*ajax.get("getdata.asp",function(obj){

*	alert(obj.responseText);	//显示从getdata.asp得到的数据

*});

*ajax.get("getdata.asp","txtData");	//将从getdata.asp得到的数据更新到ID为

txtData的HTML元素

*/

this.get=function(){

varp=[],av=arguments;

$GP(p,av,[this.url,this.oncomplete],[null,$CB]);

if(!p[0]&&!p[1])returnfalse;

return(send(p[0],"",p[1],"GET",this.async));

}

/**

*按一定时间间隔请求指定的Url并更新指定的对象

*@param	{function|Object|String}	oncomplete	正确返回时的回调函数

,或者要更新的对象,或者要更新对象的ID

*@param	{String}	url			请求的Url

*@param	{Number}	interval	发送请求的时间间隔

*@param	{Number}	times		发送请求的次数

*@return	{String}	update过程的标识符,用于停止update

*@see		AJAXRequest#stopupdate

*@example

*varajax=newAJAXRequest();

*ajax.update(function(obj){

*		alert(obj.responseText);

*	},

*	"getdata.asp",	//从getdata.asp获取数据

*	1000,	//每1秒更新一将

*	3		//更新3次

*);

*/

this.update=function(){

varp=[],purl,puo,pinv,pcnt,av=arguments;

$GP(p,av,[this.oncomplete,this.url,-1,-1],[$CB,null,$N,$N]);

if(p[2]==-1)p[3]=1;

varsf=function(){send(p[1],"",p[0],"GET",AJAX.async);};

varid=$GID();

varcf=function(cc){

sf();cc--;if(cc==0)return;

$SOP(id,setTimeout(function(){cf(cc);},p[2]));

}

cf(p[3]);

returnid;

}

/**

*停止更新对象

*@param	{String}	update_id	update方法返回的标识符

*@see		AJAXRequest#update

*@example

*varajax=newAJAXRequest();

*varup=ajax.update("txtData","getdata.asp");

*ajax.stopupdate(up);

*/

this.stopupdate=function(id){

clearTimeout($LOP(id));

}

/**

*发送数据到指定Url

*@param	{String}	[url]			请求的Url

*@param	{String}	[content]		要发送的数据

*@param	{function|Object|String}	[oncomplete]	正确返回时的回调函数

,或者要更新的对象,或者要更新对象的ID

*@see		AJAXRequest#postf

*@example

*varajax=newAJAXRequest();

*ajax.post("postdata.asp","thedatatopost",function(){});

*/

this.post=function(){

varp=[],av=arguments;

$GP(p,av,[this.url,this.content,this.oncomplete],[null,null,$CB]);

if(!p[0]&&!p[2])returnfalse;

return(send(p[0],p[1],p[2],"POST",this.async));

}

/**

*发送指定的表单到指定的Url

*@param	{String|Object}	formObject	表单对象或表单对象的ID

*@param	{function|Object|String}	[oncomplete]	正确返回时的回调函数

,或者要更新的对象,或者要更新对象的ID

*@see		AJAXRequest#post

*@example

*varajax=newAJAXRequest();

*ajax.postf("dataForm",function(obj){

*	alert(obj.responseText);

*});

*/

this.postf=function(){

varp=[],fo,vaf,pcbf,purl,pc,pm,ac=arguments.length,av=arguments;

fo=ac>0?$VO(av[0]):false;

if(!fo||(fo&&fo.nodeName!="FORM"))returnfalse;

vaf=fo.getAttribute("onvalidate");

vaf=vaf?(typeof(vaf)=="string"?newFunction(vaf):vaf):null;

if(vaf&&!vaf())returnfalse;

$GP(p,[av[1],fo.getAttribute("action"),fo.getAttribute("method")],

[this.oncomplete,this.url,this.method],[$CB,null,null]);

pcbf=p[0];purl=p[1];

if(!pcbf&&!purl)returnfalse;

pc=this.formToStr(fo);if(!pc)returnfalse;

if(p[2].toUpperCase()=="POST")

return(send(purl,pc,pcbf,"POST",true));

else{

purl+=(purl.indexOf("?")>-1?"&":"?")+pc;

return(send(purl,"",pcbf,"GET",true));

}

}

/**

*将表单对象转换化UrlEncode的字符串

*@author	SurfChen<surfchen@gmail.com>

*@linkhttp://www.surfchen.org/
*@param	{Object}formObject

*@returns{String}表单字符串

*@see		AJAXRequest#postf

*@ignore

*/

this.formToStr=function(fc){

vari,qs="",and="",ev="";

for(i=0;i<fc.length;i++){

e=fc[i];

if(e.name!=''){

if(e.type=='select-one'&&e.selectedIndex>-1)ev=e.options

[e.selectedIndex].value;

elseif(e.type=='checkbox'||e.type=='radio'){

if(e.checked==false)continue;

ev=e.value;

}

elseev=e.value;

ev=encode(ev);qs+=and+e.name+'='+ev;and="&";

}

}

returnqs;

}

}

2、注册页面Default.aspx(无后台代码)

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<head>

<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>

<metahttp-equiv="Content-Language"content="utf-8"/>

<title>Test</title>

</head>

<body>

<divid="container"><styletype="text/css">

#nav{margin:1emauto;width:700px;height:2em;}

#navulli{list-style-type:none;float:left;margin:00.5em;}

#demoContent{margin:1emauto;width:700px;text-align:left;}

#demoContentfieldset{padding:1em;}

#demoContentinput{font-size:12px;}

</style>

<scripttype="text/javascript"src="ajaxrequest.js"></script>

<scripttype="text/javascript">

varajax=newAJAXRequest;

</script>

<divstyle="clear:both;"></div>

<scripttype="text/javascript">

functioncheckUser(){

varun=document.getElementById("username");

varum=document.getElementById("usermsg");

if(!un.value){

um.innerHTML="<spanstyle='color:red;'>请输入用户名</span>";

returnfalse;

}

um.innerHTML="正在检测,请稍候";

ajax.get("demo.aspx?case=regcheck&username="+un.value,

function(obj){

if(obj.responseText=="true")

um.innerHTML="<spanstyle='color:red;'>对不起,这个用户名已经有人注册了,请换一个</span>";

else

um.innerHTML="<spanstyle='color:green;'>恭喜,用户名可用</span>";

}

);

}

functioncp1(obj){

varpm=document.getElementById("passmsg");

if(!obj.value){

pm.innerHTML="<spanstyle='color:red;'>请输入密码</span>";

returnfalse;

}

else{

pm.innerHTML="";

checkPass();

}

}

functioncp2(obj){

varpm=document.getElementById("pwcfmsg");

if(!obj.value){

pm.innerHTML="<spanstyle='color:red;'>请输入确认密码</span>";

returnfalse;

}

else{

pm.innerHTML="";

checkPass();

}

}

functioncheckPass(){

varp1=document.getElementById("password");

varp2=document.getElementById("pwconfirm");

varpm=document.getElementById("passmsg");

if(p1.value!=p2.value)

pm.innerHTML="<spanstyle='color:red;'>两次输入密码不一致,请重新输入</span>";

else

pm.innerHTML="";

}

functionfSubmit(){

returnfalse;

}

</script>

<divid="demoContent">

<formonsubmit="fSubmit();returnfalse;">

<fieldset>

<legend>注册用户</legend>

<labelfor="username">用户名: </label><inputonblur="checkUser();"type="text"size="20"id="username"name="username"/><spanid="usermsg"></span><br/>

<labelfor="password">密码:  </label><inputonblur="cp1(this);"type="password"size="20"id="password"name="password"/><spanid="passmsg"></span><br/>

<labelfor="pwconfirm">确认密码:</label><inputonblur="cp2(this);"type="password"size="20"id="pwconfirm"name="pwconfirm"/><spanid="pwcfmsg"></span><br/>

<inputtype="submit"value="注册"/><inputtype="reset"value="重置注册信息"/><br/>

</fieldset>

</form>

</div>

</div>

</body>

</html>


3、验证用户帐户是否存在数据库Demo.aspx.cs(无前台代码)

usingSystem;

usingSystem.Data;

usingSystem.Configuration;

usingSystem.Collections;

usingSystem.Web;

usingSystem.Web.Security;

usingSystem.Web.UI;

usingSystem.Web.UI.WebControls;

usingSystem.Web.UI.WebControls.WebParts;

usingSystem.Web.UI.HtmlControls;

publicpartialclassDemo:System.Web.UI.Page

{

protectedvoidPage_Load(objectsender,EventArgse)

{

stringresult=Request.QueryString["username"];

if(IsExitUserName(result))

{

Context.Response.Write("true");

}

else

{

Context.Response.Write("false");

}

}

publicboolIsExitUserName(stringUsername)

{

StringDBConnStr;

DataSetMyDataSet=newDataSet();

System.Data.SqlClient.SqlDataAdapterDataAdapter=newSystem.Data.SqlClient.SqlDataAdapter();

DBConnStr=System.Configuration.ConfigurationSettings.AppSettings["DBConnectString"];

System.Data.SqlClient.SqlConnectionmyConnection=newSystem.Data.SqlClient.SqlConnection(DBConnStr);

if(myConnection.State!=ConnectionState.Open)

{

myConnection.Open();

}

System.Data.SqlClient.SqlCommandmyCommand=

newSystem.Data.SqlClient.SqlCommand("Selectcount(1)ascountuserFROMuserinfowhereusername='"+Username+"'",myConnection);

myCommand.ExecuteNonQuery();

DataAdapter.SelectCommand=myCommand;

if(MyDataSet!=null)

{

DataAdapter.Fill(MyDataSet,"table");

}

if(myConnection.State==ConnectionState.Open)

{

myConnection.Close();

}

return(int)MyDataSet.Tables[0].Rows[0]["countuser"]>0?true:false;

}

}

4、数据库结构如下:(测试已经注册:zlp,zs,ls,其它以外帐户都可以注册)

createtableuserinfo(idintidentity(1,1),usernamevarchar(20))

go

insertintouserinfo(username)

select'zlp'

unionall

select'zs'

unionall

select'ls'


5、使用后截图如下(由于刷新数据比较快,截取的图为最终结果,感兴趣的同学,可以按照这个步骤自己测试)



内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: