您的位置：首页 > 编程语言 > ASP

[翻译]asp.net ajax xml-script教程（二）

2007-01-24 15:08 393 查看
原文地址：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文件下，其暴露出的类型描述符如下：

<!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">
</asp:ScriptManager>

<div>
<input type="button" id="btnSay" value="Click Me" />
</div>

<div>
<h1><span id="lblHello"></span></h1>
</div>

</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类的实例，它也有自己的一些类型描述符

<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。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航