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

ASP.NET 2.0 中的客户端脚本

2008-06-20 14:32 183 查看
在使用 ASP.NET 的时候,我们仍然在许多情况下需要使用客户端脚本。以下是笔者根据自己的经验和一些粗浅的研究,对此作一个简要的总结。

  一、在 HTML 里直接写脚本

  这个方法是最简单的,直到如今我写网页的时候也几乎还是使用最多的一种方式。也许一些经常使用 RegisterClientScriptBlock 的人会觉得这种方法老土,不过在我看来,它除了可以减少编译时间以外,更主要的是可以减少代码量,可读性也要好一些,更或许还可以避免一些潜在的错误。

  但是有些情况下,直接写的方法是很难完成要求的,比如说当脚本需要依赖我们在代码中动态生成的控件时,就必须要采用 Register 的方法了。

  二、使用 Literal 控件写脚本

  Literal 控件基本上就是写一段文字或代码,所以当然也可以写出客户端脚本来,实质上这个方法与第一个方法基本相同。以我个人来说,此种方法一般是用在写控件上。设想一个情况:我们需要根据某种条件来判断一批具有客户端脚本事件的控件是否显示,当然我们可以使用如 Panel 一类的容器,可是这些容器多半都要套一个 div 之类的东西,如果在某种情况下我们不希望这时出现 div 呢?当然或许是有更好更漂亮的办法,只是我都是简单地用一个 Literal 了事。^_^

  三、使用 Register Script 函数

  在 ASP.NET 1.x 中,Page 类提供了 RegisterClientScriptBlock、RegisterOnSubmitStatement 以及 RegisterStartupScript 函数,使得可以在代码中进行 ClientScript 绑定。不过到了 ASP.NET 2.0 当中,将这些函数统通移到了一个 ClientScriptManager 类中,并且还添加了类似的 RegisterClientScriptInclude 函数。在使用这个类的时候,我们可以通过 Page.ClientScript 来访问。下面介绍一下这几个函数的区别。

  RegisterClientScriptBlock:这个函数将 ClientScript 加到页面顶部,一般是在紧接着 <form> 标签的地方。需要注意的是,这个函数中的脚本在写入页面甚至执行的时候,页面的其它元素可能还没有载入完毕,因此可能不能正确地调用页面中的元素。这个函数比较常见的应用是一些客户端事件处理函数。

  RegisterClientScriptInclude:这个函数是 ASP.NET 2.0 新加入的,它一般用于将一个外部的 ClientScript 文件,比如一个 .js 文件链接入页面的时候。除此之外,它和 RegisterClientScriptBlock 基本一样,包括注意事项。

  RegisterStartupScript:这个函数将 ClientScript 加入到页面的底部,由此带来的好处自然就是可以正确地处理对页面元素的引用了。注意这里的脚本将会在页面的 onload 事件之前执行。一般来说,这里的代码都是一次性执行的。最常见的比如说是希望页面载入完毕之后弹出一个消息提示框,又或者在一个有框架的页面中,需要在一个页面装载完毕之后更新另一个页面的情况。

  RegisterOnSubmitStatement:这个函数则是将 ClientScript 与 onsubmit 事件绑定起来。

  一般的,在使用 RegisterClientScriptBlock 定义了事件处理函数后,我们可以采用以下的代码将函数与控件关联起来,这里,假定我们已经定义了一个 confirmDelete 函数:

1string script = @"return confirmDelete();";

2btnDelete.Attributes.Add("onclick", script);

  四、关于 RegisterClientScriptResource

  除了前一节提过的四个函数外,ASP.NET 2.0 还增加了一个 RegisterClientScriptResource 函数。这个函数与前几个的差异在于:它联接的是经过编译成资源的脚本。比如如下一行

1Page.ClientScript.RegisterClientScriptResource(this.GetType(), "script_resource.js");

  这里的 script_resource.js 必须是在服务端被编译进 assembly 中去,其方法是在服务端代码中添加如下一行

1[assembly: WebResource("script_resource.js", "application/x-javascript")]

  如此一来之后,在生成的页面中,我们可以看到类似下面的代码(为了节省版面,我删减了 d 和 t 的长度):

1<script src="/webclient/WebResource.axd?d=oZ35V30&t=63204" type="text/javascript"></script>

  这里的 WebResource.axd 的请求被送到服务端之后,由一个特定的 axd HttpHandler 来处理以取得相关的资源(这里就是 script-resource.js 文件)。在后面我们还可以看到,这个技术还有着更广泛的应用。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: