[翻译]asp.net ajax xml-script教程（二）
生活随笔
收集整理的這篇文章主要介紹了
[翻译]asp.net ajax xml-script教程（二）
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
原文地址：http://dotnetslackers.com/articles/atlas/xml_script_tutorial_part2.aspx?
asp.net ajax xml-script教程（二）
原文發布日期：2006.12.11
作者：Alessandro Gallo
翻譯：webabcd
概述
在xml-script教程的第一部分（譯者注：中文在這里）里我們介紹了類型描述符并且知道了如何看懂它們。在本文（第二部分）中我們將了解如何在聲明代碼里通過客戶端控件處理事件。
處理事件
在教程的第一部分討論類型描述符的時候，我們使用xml-script實例化有類型描述符的客戶端組件。有了類的類型描述符，我們就知道如何使用xml-script創建一個實例。例如，Sys.Preview.UI.Button和Sys.Preview.UI.Label類包含在PreviewScript.js文件下，其暴露出的類型描述符如下： Sys.Preview.UI.Button.descriptor = {
????properties: [ { name: 'command', type: String },
????????????????????????????????{ name: 'argument', type: String } ],
????events: [ { name: 'click' } ]
}
Sys.Preview.UI.Label.descriptor = {
????properties: [ { name: 'htmlEncode', type: Boolean },
????????????????????????????????{ name: 'text', type: String } ]
} 在接下來的示例代碼中包含了上述的所有描述符。這段代碼是一段標準的xml-script代碼塊。創建了一個Button和一個Label實例，Button的click事件調用一段javascript函數，該函數用于在Label上顯示一條信息。 <%@ Page %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0????
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
????<title>Hello XML-script</title>
</head>
<body>
<form id="form1" runat="server">
????????<asp:ScriptManager ID="TheScriptManager" runat="server">
????????????<Scripts>
????????????????<asp:ScriptReference Assembly="Microsoft.Web.Preview"
????????????????????Name="Microsoft.Web.Resources.ScriptLibrary.PreviewScript.js" />
????????????</Scripts>
????????</asp:ScriptManager>
????????<div>
????????????<input type="button" id="btnSay" value="Click Me" />
????????</div>
????????
????????<div>
????????????<h1><span id="lblHello"></span></h1>
????????</div>
????????<script type="text/xml-script">
????????????<page xmlns="http://schemas.microsoft.com/xml-script/2005">
????????????????<components>
????????????????????<label id="lblHello" />
????????????????????<button id="btnSay" click="btnSay_click" />
????????????????</components>
????????????</page>
????????</script>
????????
????????<script type="text/javascript">
????????<!--
????????function btnSay_click(evt) {
????????????$find('lblHello').set_text('Hello XML-script!');
????????}
????????//-->
????????</script>
</form>
</body>
</html> 我們主要來看看頁中xml-script代碼，和在components節點下的一些元素。第一個是Label標簽，它把一個客戶端類型映射到了Sys.Preview.UI.Label實例，雙方的映射是通過id屬性來相關聯的。第二個標簽是button，通過id屬性把相關聯的客戶端類型映射到了Sys.Preview.UI.Button實例。
button的click屬性是我們感興趣的部分，它的值是一個全局javascript函數的名字 - btnSay_click，該javascript函數寫在后面的javascript代碼塊里。類型描述符中的一個事件被映射到了xml屬性中的同名事件，這個屬性的值就是用來處理該事件的javascript函數的名稱。
讓我們來看看第二種觸發事件的方法 - 通過客戶端控件。用下面這段代碼取代上面的button標簽。 <button id="btnSay">
????<click>
????????<setPropertyAction target="lblHello" property="text"????
????????????value="Hello XML-script!" />
????</click>
</button> 現在運行這個頁，它將做如代碼改變之前一樣的工作，這是怎么回事呢？
Actions
類型描述符中的事件可以用與事件名相同的名字作為xml標簽而被解析。它包括一個或多個子元素用來調用action。
一個action就是一個內置了一個事件的執行邏輯的對象。在最后的那個例子中我們用一個被稱作SetProperty的action來處理click事件。這個action實際上就是Sys.Preview.SetPropertyAction類的實例，它也有自己的一些類型描述符 Sys.Preview.SetPropertyAction.descriptor = {
????properties: [ {name: 'property', type: String},
????????????????????????????????{name: 'propertyKey' },
????????????????????????????????{name: 'value', type: String} ]
} 你可以比較一下SetPropertyAction類和其相關的xml標簽，事實上類的名字就映射到了相關的xml元素。xml中的target屬性的值就是Lable控件的id，該Label控件的text屬性將被更改。value屬性的值就是設置Lable控件的text屬性的值。
SetPropertyAction還有一個被稱作propertyKey的類型描述符。它的作用是設置一些屬性的子屬性，下面就是一段示例代碼，你可以用它替換掉原來的相關代碼 <button id="btnSay">
????<click>
????????<setPropertyAction target="lblHello"
????????????property="text"
????????????value="Hello XML-script!" />
????????<setPropertyAction target="lblHello"
????????????property="element"
????????????propertyKey="style.backgroundColor"
????????????value="#FFFF00" />
????</click>
</button> 這樣，我們就有兩個action了。第一個action用于設置Lable的text屬性，第二個action用戶把Label的背景顏色設為×××。第二個action的property屬性設置成了“element”，它返回一個關聯到Label的DOM（span標簽）。我們通過get_的方式來取得屬性，propertyKey屬性包含了擴展屬性，如果我們要訪問style對象的backgroundColor屬性的話，應該使用像下面這樣的javascript語句 $find('lblHello').get_element().style.backgroundColor = '#FFFF00'; 總結
xml-script允許通過聲明代碼實例化有類型描述符的客戶端組件。它允許調用一段javascript函數，或者執行一個或多個action去處理事件。
在下一篇教程里，我們將繼續討論事件，并且介紹一下Microsoft Ajax Library里的其它一些內置action。
asp.net ajax xml-script教程（二）
原文發布日期：2006.12.11
作者：Alessandro Gallo
翻譯：webabcd
概述
在xml-script教程的第一部分（譯者注：中文在這里）里我們介紹了類型描述符并且知道了如何看懂它們。在本文（第二部分）中我們將了解如何在聲明代碼里通過客戶端控件處理事件。
處理事件
在教程的第一部分討論類型描述符的時候，我們使用xml-script實例化有類型描述符的客戶端組件。有了類的類型描述符，我們就知道如何使用xml-script創建一個實例。例如，Sys.Preview.UI.Button和Sys.Preview.UI.Label類包含在PreviewScript.js文件下，其暴露出的類型描述符如下： Sys.Preview.UI.Button.descriptor = {
????properties: [ { name: 'command', type: String },
????????????????????????????????{ name: 'argument', type: String } ],
????events: [ { name: 'click' } ]
}
Sys.Preview.UI.Label.descriptor = {
????properties: [ { name: 'htmlEncode', type: Boolean },
????????????????????????????????{ name: 'text', type: String } ]
} 在接下來的示例代碼中包含了上述的所有描述符。這段代碼是一段標準的xml-script代碼塊。創建了一個Button和一個Label實例，Button的click事件調用一段javascript函數，該函數用于在Label上顯示一條信息。 <%@ Page %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0????
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
????<title>Hello XML-script</title>
</head>
<body>
<form id="form1" runat="server">
????????<asp:ScriptManager ID="TheScriptManager" runat="server">
????????????<Scripts>
????????????????<asp:ScriptReference Assembly="Microsoft.Web.Preview"
????????????????????Name="Microsoft.Web.Resources.ScriptLibrary.PreviewScript.js" />
????????????</Scripts>
????????</asp:ScriptManager>
????????<div>
????????????<input type="button" id="btnSay" value="Click Me" />
????????</div>
????????
????????<div>
????????????<h1><span id="lblHello"></span></h1>
????????</div>
????????<script type="text/xml-script">
????????????<page xmlns="http://schemas.microsoft.com/xml-script/2005">
????????????????<components>
????????????????????<label id="lblHello" />
????????????????????<button id="btnSay" click="btnSay_click" />
????????????????</components>
????????????</page>
????????</script>
????????
????????<script type="text/javascript">
????????<!--
????????function btnSay_click(evt) {
????????????$find('lblHello').set_text('Hello XML-script!');
????????}
????????//-->
????????</script>
</form>
</body>
</html> 我們主要來看看頁中xml-script代碼，和在components節點下的一些元素。第一個是Label標簽，它把一個客戶端類型映射到了Sys.Preview.UI.Label實例，雙方的映射是通過id屬性來相關聯的。第二個標簽是button，通過id屬性把相關聯的客戶端類型映射到了Sys.Preview.UI.Button實例。
button的click屬性是我們感興趣的部分，它的值是一個全局javascript函數的名字 - btnSay_click，該javascript函數寫在后面的javascript代碼塊里。類型描述符中的一個事件被映射到了xml屬性中的同名事件，這個屬性的值就是用來處理該事件的javascript函數的名稱。
讓我們來看看第二種觸發事件的方法 - 通過客戶端控件。用下面這段代碼取代上面的button標簽。 <button id="btnSay">
????<click>
????????<setPropertyAction target="lblHello" property="text"????
????????????value="Hello XML-script!" />
????</click>
</button> 現在運行這個頁，它將做如代碼改變之前一樣的工作，這是怎么回事呢？
Actions
類型描述符中的事件可以用與事件名相同的名字作為xml標簽而被解析。它包括一個或多個子元素用來調用action。
一個action就是一個內置了一個事件的執行邏輯的對象。在最后的那個例子中我們用一個被稱作SetProperty的action來處理click事件。這個action實際上就是Sys.Preview.SetPropertyAction類的實例，它也有自己的一些類型描述符 Sys.Preview.SetPropertyAction.descriptor = {
????properties: [ {name: 'property', type: String},
????????????????????????????????{name: 'propertyKey' },
????????????????????????????????{name: 'value', type: String} ]
} 你可以比較一下SetPropertyAction類和其相關的xml標簽，事實上類的名字就映射到了相關的xml元素。xml中的target屬性的值就是Lable控件的id，該Label控件的text屬性將被更改。value屬性的值就是設置Lable控件的text屬性的值。
SetPropertyAction還有一個被稱作propertyKey的類型描述符。它的作用是設置一些屬性的子屬性，下面就是一段示例代碼，你可以用它替換掉原來的相關代碼 <button id="btnSay">
????<click>
????????<setPropertyAction target="lblHello"
????????????property="text"
????????????value="Hello XML-script!" />
????????<setPropertyAction target="lblHello"
????????????property="element"
????????????propertyKey="style.backgroundColor"
????????????value="#FFFF00" />
????</click>
</button> 這樣，我們就有兩個action了。第一個action用于設置Lable的text屬性，第二個action用戶把Label的背景顏色設為×××。第二個action的property屬性設置成了“element”，它返回一個關聯到Label的DOM（span標簽）。我們通過get_的方式來取得屬性，propertyKey屬性包含了擴展屬性，如果我們要訪問style對象的backgroundColor屬性的話，應該使用像下面這樣的javascript語句 $find('lblHello').get_element().style.backgroundColor = '#FFFF00'; 總結
xml-script允許通過聲明代碼實例化有類型描述符的客戶端組件。它允許調用一段javascript函數，或者執行一個或多個action去處理事件。
在下一篇教程里，我們將繼續討論事件，并且介紹一下Microsoft Ajax Library里的其它一些內置action。
轉載于:https://blog.51cto.com/webabcd/345295
總結
以上是生活随笔為你收集整理的[翻译]asp.net ajax xml-script教程（二）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： python中字母大小顺序,如何在Pyt
- 下一篇： 关于设计模式——策略模式-Strateg