基于jQuery實現(xiàn)的Ajax 驗證用戶名是否存在的實現(xiàn)代碼
更新時間：2011年04月06日 22:34:36 作者：
基于jQuery實現(xiàn)的Ajax 驗證用戶名是否存在的實現(xiàn)代碼，需要的朋友可以參考下。
實例：
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 ("用戶名已經(jīng)存在！");
}
else
{
Response.Write ("您可以使用此用戶名！");
}
}
1、請求頁面AJax.aspx
HTML代碼
復(fù)制代碼 代碼如下:
<div>
<input id="txtName" type="text" /><input type="button" value="查看用戶名是否存在" id="btn" onclick="JudgeUserName();" />
<div id="showResult" style="float:left">div>
div>
JS代碼
復(fù)制代碼 代碼如下:
<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
后臺代碼
復(fù)制代碼 代碼如下:
protected void Page_Load(object sender, EventArgs e)
{
string userName = Request.QueryString["userName"].ToString ();
if (userName == "James Hao")
{
Response.Write ("用戶名已經(jīng)存在！");
}
else
{
Response.Write ("您可以使用此用戶名！");
}
}
3 、運行界面
(1)初始化界面
（2）正在查詢提示頁面
（3） 驗證用戶名已經(jīng)存在頁面
（4） 驗證用戶名未存在頁面
至此 AJAX驗證用戶名是否存在的功能已經(jīng)完成。
相關(guān)文章
這篇文章主要是對同域jQuery(跨)iframe操作DOM的示例進行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12
今天在做一個項目功能時需要顯示checkbox選項來讓用戶進行選擇，由于前端不是很熟練，所以做了一個簡單的Demo，其中遇到一些小問題，特記錄下來，希望能幫到遇到類似問題的同學們2013-11-11
jquery在啟動頁面時,自動加載數(shù)據(jù)的實例
下面小編就為大家分享一篇jquery在啟動頁面時,自動加載數(shù)據(jù)的實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-01-01
只需引入jqery.js,不需要引入插件，利用jquery定義的一些基本方法，就能實現(xiàn)諸如隱藏，顯示，淡入，淡出，半透明等2010-12-12![jQuery的選擇器中的通配符[id^=''code'']或[name^=''code'']及jquery選擇器總結(jié)](http://img.jbzj.com/images/xgimg/bcimg4.png)
jQuery的選擇器中的通配符[id^=''code'']或[name^=''code'']及jquery選擇器總結(jié)
這篇文章主要介紹了jQuery的選擇器中的通配符[id^='code']或[name^='code']及jquery選擇器總結(jié)的相關(guān)資料,需要的朋友可以參考下2015-12-12
這篇文章主要介紹了jquery實現(xiàn)超簡潔的TAB選項卡效果代碼,涉及jquery通過鼠標click事件結(jié)合鏈式操作動態(tài)操作tab選項卡的功能,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08
jquery checkbox,radio是否選中的判斷代碼
jquery checkbox,radio是否選中的判斷代碼,需要的朋友可以參考下。2010-03-03
這篇文章主要給大家介紹了利用jquery如何禁止外層滾動條的滾動,文中給出了詳細的示例代碼，相信對大家的理解和學習具有一定的參考借鑒價值，有需要的朋友可以參考借鑒，下面來一起看看吧。2017-01-01
本文帶你了解了一遍 jQuery 3 將會帶來的一些重大變化?；蛟S你已經(jīng)注意到了，這個版本是可能對你現(xiàn)有的項目產(chǎn)生太大的影響，因為沒有引入太多許多重大更改。2016-06-06
jQuery通過寫入cookie實現(xiàn)更換網(wǎng)頁背景的方法
這篇文章主要介紹了jQuery通過寫入cookie實現(xiàn)更換網(wǎng)頁背景的方法,涉及jQuery結(jié)合cookie設(shè)置頁面元素屬性的相關(guān)操作技巧,需要的朋友可以參考下2016-04-04