建站
咨詢
售后
建站咨詢
新聞中心
ASP.NET生成客戶端腳本
作為一家“創(chuàng)意+整合+營銷”的成都網(wǎng)站建設(shè)機構(gòu)，我們在業(yè)內(nèi)良好的客戶口碑。創(chuàng)新互聯(lián)提供從前期的網(wǎng)站品牌分析策劃、網(wǎng)站設(shè)計、網(wǎng)站制作、成都網(wǎng)站制作、創(chuàng)意表現(xiàn)、網(wǎng)頁制作、系統(tǒng)開發(fā)以及后續(xù)網(wǎng)站營銷運營等一系列服務(wù)，幫助企業(yè)打造創(chuàng)新的互聯(lián)網(wǎng)品牌經(jīng)營模式與有效的網(wǎng)絡(luò)營銷方法,創(chuàng)造更大的價值。
自Google發(fā)布除英文外的唯一名稱——谷歌以來，中國用戶一片嘩然，暫且不論這個谷歌是不是比胡弋更合適，但Google想借此闡述產(chǎn)品內(nèi)涵，取悅中國用戶之心路人皆知；今年Web 2.0引無數(shù)風(fēng)投競折腰，40億美金撒向大陸都是錢，于是網(wǎng)站們?nèi)缤▌∽兡?，搖身一變，換成一張張博客、書簽、圈圈的面龐。冷靜思考，在信息過剩，特別是同質(zhì)化嚴(yán)重的前提下，數(shù)據(jù)挖掘、用戶體驗成為網(wǎng)站關(guān)鍵，有人戲稱三分長相(內(nèi)容)，七分打扮(內(nèi)容聚集和用戶體驗)。即是如此，人機交互設(shè)計從可有可無提升到必不可少、Ajax技術(shù)變火也就不奇怪了。
服務(wù)器端處理總是Web應(yīng)用系統(tǒng)的核心功能，大多數(shù)的信息處理在服務(wù)器端完成。但如果把所有功能都放在服務(wù)器端，讓頁面帶著幾百幾千字節(jié)的 ViewState在網(wǎng)絡(luò)中來回穿梭，那可不是惡心，那是相當(dāng)?shù)膼盒?。所以我們需要客戶端充?dāng)服務(wù)器端的代言人，通過執(zhí)行腳本程序來分擔(dān)一些系統(tǒng)功能，讓用戶更爽，讓服務(wù)器更輕松。
ASP.NET通過控件與用戶完成交互，但就客戶端瀏覽器而言，它從未聽過，也不和控件打交道，它所熟悉的是HTML標(biāo)簽和客戶端腳本程序。要讓客戶端充當(dāng)服務(wù)器端的代言人，就必須讓二者交流與溝通，即：添加客戶端行為、ASP.NET生成客戶端腳本、控件行為與客戶端行為映射等。
attribute和property是一對有趣的近義詞，MSDN中有這么一句話：“在 ASP.NET 服務(wù)器控件的標(biāo)記中，可以使用屬性 (attribute) 來設(shè)置屬性 (property) 值?！睂傩栽O(shè)置屬性？頭暈?zāi)垦Ｖ?。簡單地理解，property是類的成員，attribute是類的外觀。前者是品牌自身特征，后者為代言人特征，前者可以通過后者來展示自己。反映到控件與對應(yīng)HTML標(biāo)簽，控件狀態(tài)是property，標(biāo)簽中對應(yīng)的字符串是attribute，即瀏覽器所看到的服務(wù)器端控件的外形。
宣布：添加客戶端行腳本
HTTP響應(yīng)流就是一串字符流，頁面生成一個HtmlTextWriter實例，專門收集控件們生成的HTML標(biāo)記文本，它按控件樹的次序，讓控件的RenderControl方法檢查自己的Visible屬性，如果為真就調(diào)用控件的Render方法向?qū)嵗砑訕?biāo)記文本，搞定后調(diào)用RenderChildren方法向下遞歸傳遞。所以在頁面調(diào)用控件Render方法之時或之前，可以在動態(tài)地修改標(biāo)簽中的Attribute以組裝成相應(yīng)的標(biāo)記文本。
向控件添加客戶端行為，最簡單的方法是在.apsx文件中的標(biāo)簽直接聲明對應(yīng)的Attribute，或以編程方式調(diào)用控件Attributes 集合的Add方法，即向客戶端瀏覽器宣布：我的代言人是老徐~~
- <scriptrunatscriptrunat="server">
- protectedvoidPage_Load(objectsender,EventArgse){
- //為btnTest控件添加onmouseover和onmouseout客戶端行為
- btnTest.Attributes.Add("onmouseover","MakeRed();");
- btnTest.Attributes.Add("onmouseout","RestoreColor();");
- }
- script><headrunatheadrunat="server">
- <scriptlanguagescriptlanguage="javascript">
- varpreviousColor;
- //改變前景色
- functionMakeRed(){
- previousColor=window.event.srcElement.style.color;
- window.event.srcElement.style.color="#FF0000";
- }
- //恢復(fù)原前景色
- functionRestoreColor(){
- window.event.srcElement.style.color=previousColor;
- }
- script>head><formidformid="form1"runat="server">
- <asp:buttonidasp:buttonid="btnTest"text=”btnTest”runat="server"/>form>body>html>
注入：動態(tài)添加客戶端腳本
除了直接在.aspx文件中顯式聲明外，Page類還提供了一些方法用于動態(tài)創(chuàng)建客戶端腳本。所謂的動態(tài)ASP.NET生成腳本，實際上就是生成對應(yīng)的腳本字符串，然后使用Page類提供的RegisterClientScriptBlock 、RegisterOnSubmitStatement等方法注入到HtmlTextWriter實例中合適的位置，同時，ASP.NET還提供若干方法用于輔助生成腳本，無非就是加點隱藏輸入域、數(shù)組之類的東西。
控件也可以在OnPreRender方法調(diào)用這些方法通知頁面添加所需腳本字符串。之所以不在Render方法中實現(xiàn)，是因為HtmlTextWriter實例在被傳遞到控件手上時，Page類已經(jīng)完成在HtmlTextWrite實例中生成對應(yīng)文本，慢了一步。下例為頁面回發(fā)添加一個確定對話框。
- <scriptrunatscriptrunat="server">
- protectedvoidPage_Load(Objectsender,EventArgse){
- StringscriptText="returnconfirm('要提交嗎?')";
- //添加頁面提交時執(zhí)行的腳本。
- RegisterOnSubmitStatement("ConfirmSubmit",scriptText);
- }script>head><formidformid="form1"runat="server">
- <asp:buttonidasp:buttonid=btnTesttext=PostBackrunat="server"/>form>body>html>
攜手：GetPostBackEventReference方法
很多時候我們希望客戶端行為能夠和相應(yīng)的服務(wù)端行為攜起手來，共同完成一個完整的系統(tǒng)功能，讓客戶端行為能夠觸發(fā)相應(yīng)的服務(wù)器端行為，即兩者映射。在 ASP.NET1.1中，本質(zhì)上是把頁面為原子回發(fā)單位，客戶端行為只能在頁面回發(fā)之前向隱藏標(biāo)志域里寫入帶有自身特征的數(shù)據(jù)，頁面回發(fā)后，控件們通過檢查隱藏標(biāo)志域的數(shù)據(jù)來觸發(fā)相應(yīng)的行為。
客戶端與服務(wù)端攜手典型例子有兩個：一是GetPostBackEventReference方法，它可以引發(fā)帶有特征數(shù)據(jù)的頁面回傳；一是大名鼎鼎的驗證器構(gòu)架，除此之外，標(biāo)準(zhǔn)控件也有若干是通過客戶端行為來實現(xiàn)。下面我們以前者為例，演示完整的“ASP.NET生成-客戶端處理-回發(fā)-服務(wù)端處理”過程。
- publicclassMyControl:Control,IPostBackEventHandler{
- //定義Number屬性
- publicintNumber{
- get{
- if(ViewState["Number"]!=null)
- return(int)ViewState["Number"];
- else
- return50;
- }
- set{
- ViewState["Number"]=value;
- }
- }
- //依賴于用戶操作的事件處理
- //eventArgument為事件數(shù)據(jù)，這里由GetPostBackEventReference設(shè)置
- //事件數(shù)據(jù)直接引起該控件狀態(tài)的變化
- publicvoidRaisePostBackEvent(stringeventArgument){
- if(eventArgument=="inc")Number++;
- if(eventArgument=="dec")Number--;
- }
- //生成控件對應(yīng)的HTML標(biāo)記文本
- //除生成Number屬性文本外，還生成兩個引發(fā)回發(fā)并帶著回發(fā)事件參數(shù)的超鏈接
- //GetPostBackEventReference方法發(fā)出啟動回發(fā)的客戶端腳本，并提供引用
- protectedoverridevoidRender(HtmlTextWriterwriter){
- writer.Write("控件值:"+Number.ToString()+"");
- writer.Write(""javascript:"+
- Page.GetPostBackEventReference(this,"inc")+"\">+");
- writer.Write("or");
- writer.Write(""javascript:"+
- Page.GetPostBackEventReference(this,"dec")+"\">-");}}
由于ASP.NET1.1是以頁面為原子回發(fā)單位，代言人與品牌之間的溝通和聯(lián)系要付出巨大的性能代價。要改善只能打破以頁面作為原子回發(fā)單位的制度。以上介紹ASP.NET生成客戶端腳本。
【編輯推薦】
- ASP.NET控件學(xué)習(xí)總結(jié)
- 再談ASP.NET緩存機制：開發(fā)效率與優(yōu)化的平衡
- ASP.NET前臺控件點評：避免強迫癥，奔向簡潔高效
- ASP.NET報表打印的實現(xiàn)：分頁計算方式
- 點評一下ASP.NET的WEB控件
新聞標(biāo)題：ASP.NET生成客戶端腳本
文章分享：http://www.dlmjj.cn/article/dhdpcgo.html
