ASPNET結(jié)合Ajax開發(fā)實(shí)例_第1頁
ASPNET結(jié)合Ajax開發(fā)實(shí)例_第2頁
ASPNET結(jié)合Ajax開發(fā)實(shí)例_第3頁
ASPNET結(jié)合Ajax開發(fā)實(shí)例_第4頁
ASPNET結(jié)合Ajax開發(fā)實(shí)例_第5頁
已閱讀5頁,還剩3頁未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡介

1、作者:王宇為大家寫了一個(gè)簡單的ajax制作實(shí)例,純手工編寫AJAX引擎大家要是有什么問題,給我發(fā)Email:warensoft  如果想了解更多關(guān)于DotNet方面的技術(shù)資料,文章以及視頻,請(qǐng)到本團(tuán)隊(duì)的主頁:實(shí)例需求:利用Ajax技術(shù)實(shí)現(xiàn)一個(gè)頁面不刷新的,并且驗(yàn)證一個(gè)用戶名是否被注冊(cè)過的過程。要求:在頁面中添加一個(gè)文本框標(biāo)簽用于輸入用戶名,添加一個(gè)按鈕用于提交用戶數(shù)據(jù)。驗(yàn)證的結(jié)果被直接打印在頁面上。操作步驟如下:1)打開Visual Studio(筆者使用的是Visual Studio2008 Beta2,因?yàn)閂S2008在頁面的布局方面更好控制),建立一個(gè)網(wǎng)站,如圖2-5

2、所示。圖2-5新建立一個(gè)網(wǎng)站項(xiàng)目建立好之后,大家會(huì)看到VS2008中基本上已經(jīng)將Express Web的功能集成,可以將HTML的設(shè)計(jì)視圖和HTML的代碼進(jìn)行上下分開顯示。如圖2-6所示。圖2-6 VS2008的編輯窗口2)在VS2008工具箱的HTML欄中添加一個(gè) 控件及 控件。如圖2-7所示。圖2-7 添加表單控件3) 在<Head></Head>中加入<script type ="text/javascript"></script>標(biāo)簽,以便進(jìn)行Ajax引擎的編寫,并在基本定義一個(gè)XMLHttpRequest對(duì)象,但是并

3、不進(jìn)行初始化操作。如圖2-8所示。圖2-8 添加新標(biāo)簽3)定義兩個(gè)函數(shù)Validation()及OnMessageBack(),前者用于初始化XMLHttpRequest對(duì)象,后者則在服務(wù)器的數(shù)據(jù)返回被調(diào)用。在Validation()函數(shù)中加入如下Javascript代碼:/實(shí)例化XMLHttpRequest對(duì)象        xmlhttp =new ActiveXObject ("Microsoft.XMLHTTP");       

4、; /找到名為“Text1”的文本框        var name=document .getElementById ("Text1");        /利用Open方法向指定URL        /查詢字符串“name”將文本框中的數(shù)據(jù)傳送到目標(biāo)頁面        xmlhttp .open(

5、"Post","default.aspx?name="+name.value);        /設(shè)置當(dāng)服務(wù)器響應(yīng)返回時(shí)用于處理響應(yīng)的函數(shù)名        xmlhttp .onreadystatechange=OnMessageBack;        /送發(fā)請(qǐng)求       

6、 xmlhttp .send(null);代碼添加完畢后,Html頁面內(nèi)容如圖2-9所示。圖2-9 添加代碼4)添加OnMessageBack()函數(shù)的內(nèi)容。代碼如下:function OnMessageBack()            /判斷請(qǐng)求狀態(tài)及HTTP狀態(tài)是否都能滿足條件        if (xmlhttp .readystate=4&&xmlhttp .status=200) 

7、0;                  /將返回的文本打印到頁面上            document .write (xmlhttp .responsetext);            代碼添加完畢后,Html頁面內(nèi)容如圖

8、2-9所示。圖2-10添加代碼5) 下面為Button1添加事件代碼,將其標(biāo)簽修改為<input id="Button1" type="button" onclick ="Validation()" value="button" />6)頁面中的Ajax引擎已經(jīng)編寫完畢。在圖2-10所示的第18行代碼中,大家可以看到該用戶名是通過一個(gè)名為“name”的查詢字符串進(jìn)行傳遞的,該查詢字符串傳遞到服務(wù)器后需要進(jìn)行后臺(tái)處理,因此,要對(duì)“Default.aspx.cs”中的Page_Load方法添加一些ADO.NET代碼。這里的數(shù)據(jù)庫使用的是“Northwind”示例數(shù)據(jù)庫。如圖2-11所示。圖2-11 后臺(tái)C#代碼這里要注意,當(dāng)服務(wù)器利用Response.Write()方法向客戶端發(fā)出響應(yīng)后,客戶端的Ajax引擎就截獲該響應(yīng)流,并在我們事先定義的“OnMessageBack()”方法中進(jìn)行處理。7)下面按F5進(jìn)行調(diào)試。在文本框中輸入“ALFKI”,點(diǎn)擊按鈕,頁面中會(huì)顯示“該用戶名已經(jīng)被占用

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

評(píng)論

0/150

提交評(píng)論