Your Ad Here
首页 | 编程语言 | 网站建设 | 游戏天堂 | 冲浪宝典 | 网络安全 | 操作系统 | 软件时空 | 硬件指南 | 病毒相关 | IT 认证
软讯网络 > 网站建设 > ASP > 将JavaScript事件绑定到ASP.NET对象
【标  题】:将JavaScript事件绑定到ASP.NET对象
【关键字】:JavaScript,ASP.NET
【来  源】:http://blog.csdn.net/ITFLY8/archive/2006/12/30/1468752.aspx

将JavaScript事件绑定到ASP.NET对象

Your Ad Here 出处:http://www.zdnet.com.cn/developer/code/story/0,3800066897,39140452-1,00.htm

ASP.NET框架具有强大的功能和不错的灵活性。你可创建服务器端代码来完成任何类型的任务,但在许多任务中,仍然只有客户端JavaScript才最方便。在ASP.NET Web窗体中添加JavaScript类似于把它添加到其他任何类型的网页中。但是,将代码绑定到ASP.NET窗体元素时,却需要一定的技巧。
为什么要使用JavaScript?
 

客户端JavaScript的优点在其他许多文章中都有详尽的论述。其实最主要的优点就是性能。虽然能用C#或VB.NET来开发相同的功能,但这要求和服务器建立一次额外的往返行程,所以必然损失一定的性能。相反,JavaScript代码和网页一起下载,并由浏览器负责执行,不会牵涉到多余的服务器调用。我们经常用这种技术进行字段验证、确认对话框以及打开其他窗口。

下面将讲解如何将JavaScript包括到一个标准的网页中。然后,我们准备采取一些额外的步骤,让JavaScript能够与ASP.NET Web窗体良好地协作。

传统Web窗体

普通网页含有各种标准化的区域,比如head和body。通常,JavaScript函数要放到网页的head部分,使其在body之前加载。等body加载之后,立即就能使用它们。对函数的调用可在body的各个HTML元素中进行。例如以下JavaScript函数:
 
function confirmSubmit() {
var doc = document.forms[0];
var msg = "Are you sure you want to submit this data?";
if (confirm(msg)) {
doc.submit();
} else {
// do nothing
} }

 
该函数的作用十分简单:它要求用户确认是否想提交文档。如果在确认对话框中单击Yes,就提交文档;否则什么事情都不发生。该函数可轻松地绑定到一个HTML提交按钮:
 
<input type=”button” value=”submit” name=”butSubmit” onClick=”confirmSubmit();”>
 
用户单击提交按钮后,会出现如A所示的消息。

图A

示范JavaScript确认对话框

虽然上述JavaScript非常简单,但你随时都可对其进行增强,以实现任何需要的逻辑。由于它避免了对服务器的额外调用,所以有助于提升性能。但是,在ASP.NET Web窗体中添加这种类型的功能时,却不如在普通Web窗体中添加时直观。

首先,函数要添加到窗体的head部分(参见B)。之后,必须从一个ASP.NET控件中调用它。图B展示了按钮声明。

图B

示范ASP.NET Web窗体

最关键的一步就是将ASP.NET按钮绑定到JavaScript函数。这需要使用ASP.NET按钮UserControl对象的Attributes属性。Attributes属性提供了一个Add方法,允许为按钮添加事件。为此需要使用以下VB.NET代码:
 
butSubmit.Attributes.Add("onClick", "return confirmSubmit();")
 
图C展示了Visual Studio .NET环境中的VB.NET代码。

图C

为按钮添加函数

我个人认为这种语法容易使人混淆,因为我已习惯了标准的Web窗体语法。但是,如果将标准onClick事件直接输入ASP.NET Web窗体(HTML源代码)中会导致错误。所以,我只好研究一下文档,了解正确的语法是什么。

当然,代码可以轻松地扩展。ASP.NET提供了验证控件,但使用本文的代码,可轻松地添加和引用JavaScript。下面来看看如何在提交之前验证两个Name字段。

下面对第一个例子的示范代码进行扩展,在其中添加两个文本字段,如D所示。这些字段是用以下JavaScript代码来验证的:
 

 
function valSubmit() {
var doc = document.forms[0];
var msg = "";
var msg = "";
if (doc.txtFirstName.value == "") {
msg += "- First Name" + "\n";
}
if (doc.txtLastName.value == "") {
msg += "- Last Name" + "\n";
}
if (msg == "") {
doc.submit();
} else {
var valMsg1 = "The following required fields are missing.";
var valMsg2 = "Please complete and resubmit."
alert(valMsg1 + "\n\n" + valMsg2 + "\n\n" + msg);
return;
} }

 
这是一个非常基本的函数。它检查Name字段中的字符。如果字段不为空,就提交文档。否则会显示一条消息,要求用户填写字段并重新提交。函数通过相同的语法绑定到按钮:
 
butSubmit.Attributes.Add("onClick", "return valSubmit();")

图D

添加好的文本字段

好戏才刚刚开始

使用按钮UserControl对象的Attributes属性来绑定一个JavaScript事件,这只是该属性众多应用中的一种。还可用Attributes来更改与控件绑定的各种颜色,以及应用级联样式(CSS)元素等等。详细情况可参考联机帮助或者其他.NET文档。

不要重复别人的劳动

Internet富含丰富的JavaScript代码,它们可用于完成几乎任何任务,所以完全没必要重复别人的劳动。虽然ASP.NET十分强大,但作为我们亲密的老朋友,JavaScript的作用也不可小觑,它能帮助我们完成常见的任务,并由客户端来减轻服务器的负担。

 
初步优化寒羽枫的web日历:【上一篇】
WSORM:为WSBLog写的简单ORM(一):【下一篇】
【相关文章】
  • javascript对象入门(1)
  • ASP.NET 2.0中轻松实现网站换肤
  • JavaScript和Jscript的版本及规范
  • 压缩javascript
  • JavaScript基础知识总结
  • 用javascript能控制网页窗口的大小和位置总结
  • javascript 汇总
  • Asp.net制作一个简单的等待窗口
  • shawl.qiu javascript 表单列表框联动类 v1.0 (支持无限级联动)
  • 文本编码批量转换器——搞asp.net必备
  • 【随机文章】
  • 致歉
  • Huffman编码
  • PM导入后你可以利用他人画的东西
  • gcc常用的编译选项对代码的影响(2)
  • 明伦五笔高手1.2A
  • 博客堂升级完毕
  • 全局XML Web服务体系结构概述
  • RedHat Linux 9注销
  • 读 《Windows程序设计》(3)
  • MDX函数使用介绍(三):聚合函数
  • 【相关评论】
    没有相关评论
    【发表评论】
    姓名:
    邮件:
    随机码*
    评论*
          
    |  首 页  |  版权声明  |  联系我们   |  网站地图  |
    CopyRight © 2004-2007 bbb软讯网络 All Rigths Reserved.