ASP.NET为Web程序开发提供了新的范例。其中包括一系列基于服务器的控件,这些控件类似于HTML窗体中诸如文本框、按钮等元素。使用这些控件的问题是必须调用服务器。JavaScript为很多任务提供多种选择的机会,而这些过程不需要调用服务器。让我们来看结合JavaScript与ASP.NET所带来的强大功能。

性能是必需的
调用服务器要求带宽和服务器处理时间,然而对一个可以享受高速流通的局域网程序将不会有任何问题,但是在广域网中就是不同的情况。一个因特网用户连接速度的不同主要取决于用户的拨号调制解调器、带宽或者电缆调制解调器。使用用户型的JavaScript可以不需要调用服务器。

传统方法
一个标准的网页窗体包括像标题框、正文和窗体在内的页面。JavaScript函数按传统方法被放置在网页窗体的标题框,这些函数允许被页面的其它部分载入和利用,一旦被载入,这些函数将从HTML元素中调用。

让我们看看一个简单的JavaScript的例子:

 1}

这一函数将检验数据被传送到窗体中的两个HIML区。如果其中一个区是空的,将显示错误信息并且停止运行。如果两个区都有值时,窗体被提交,你可以使用以下的代码调用这一函数:

1结合JavaScript与ASP.NET Web窗体进行程序开发<input type="button" value="submit" name="btnSubmit" onClick="valSubmit();"


利用这一关系,在HIML区没有数据之前,窗体是不会被提交的。这样我们可以看到,代码变得更加简单,但是由于无需调用额外的服务器而不会产生任何副作用。JavaScript简短而实用,这就意味着窗体不需要额外的载入时间。

将JavaScript和ASP.NET结合在一起
ASP.NET网页窗体允许使用标准的HTML,因此你可以容易地使用前面的范例。ASP.NET用户控件允许你很轻松地调用服务器代码来处理 Web窗体。庆幸的是,用户控件和JavaScript的结合使用完全是可以的。我将利用一个ASP.NET按钮控件的例子来说明这一使用过程。

按钮控件的所有属性提供了将JavaScript连接到控件的方式。首先,将JavaScript函数放置在ASP.NET网页窗体中,但是通过添加返回值可以改变放置的方法。如果确认通过,函数值返回为真,与按钮相关的服务器函数就会别调用。如果返回值为假,则窗体不会被提交。

 1结合JavaScript与ASP.NET Web窗体进行程序开发<%@ Page language="c#" %>
 2结合JavaScript与ASP.NET Web窗体进行程序开发<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
 3结合JavaScript与ASP.NET Web窗体进行程序开发<html><head>
 4结合JavaScript与ASP.NET Web窗体进行程序开发<title>WebForm1</title>
 5结合JavaScript与ASP.NET Web窗体进行程序开发<script language="javascript">
 6结合JavaScript与ASP.NET Web窗体进行程序开发function valSubmit() {
 7结合JavaScript与ASP.NET Web窗体进行程序开发    var doc = document.forms[0];
 8结合JavaScript与ASP.NET Web窗体进行程序开发    varmsg = "";
 9结合JavaScript与ASP.NET Web窗体进行程序开发    
10结合JavaScript与ASP.NET Web窗体进行程序开发    if (doc.firstName.value == "") {
11结合JavaScript与ASP.NET Web窗体进行程序开发        msg += "- Please enter a first name.n";
12结合JavaScript与ASP.NET Web窗体进行程序开发    }
13结合JavaScript与ASP.NET Web窗体进行程序开发    if (doc.lastName.value == "") {
14结合JavaScript与ASP.NET Web窗体进行程序开发        msg += "- Please enter a last name.n";
15结合JavaScript与ASP.NET Web窗体进行程序开发    }
16结合JavaScript与ASP.NET Web窗体进行程序开发    if (msg == "") {
17结合JavaScript与ASP.NET Web窗体进行程序开发        doc.submit();
18结合JavaScript与ASP.NET Web窗体进行程序开发        return true;
19结合JavaScript与ASP.NET Web窗体进行程序开发    } else {
20结合JavaScript与ASP.NET Web窗体进行程序开发        alert("The following errors were encountered.nn" + msg);
21结合JavaScript与ASP.NET Web窗体进行程序开发        return false;
22结合JavaScript与ASP.NET Web窗体进行程序开发    } 
23结合JavaScript与ASP.NET Web窗体进行程序开发}
24结合JavaScript与ASP.NET Web窗体进行程序开发</script>
25结合JavaScript与ASP.NET Web窗体进行程序开发<script language="C#" runat="server">
26结合JavaScript与ASP.NET Web窗体进行程序开发private void btnSearch_Click(object sender, System.EventArgs e) {
27结合JavaScript与ASP.NET Web窗体进行程序开发    Response.Write("Search");
28结合JavaScript与ASP.NET Web窗体进行程序开发}
29结合JavaScript与ASP.NET Web窗体进行程序开发private void Page_Load(object sender, System.EventArgs e) {
30结合JavaScript与ASP.NET Web窗体进行程序开发    btnSubmit.Attributes.Add("onClick", "return valSubmit();");
31结合JavaScript与ASP.NET Web窗体进行程序开发}
32结合JavaScript与ASP.NET Web窗体进行程序开发</script></head>
33结合JavaScript与ASP.NET Web窗体进行程序开发<body>
34结合JavaScript与ASP.NET Web窗体进行程序开发<form ></html>

这些代码中最为关键的一行是:

1结合JavaScript与ASP.NET Web窗体进行程序开发btnSubmit.Attributes.Add("onClick", "return valSubmit();");

通过风格属性使用CSS可以将元素放置在HIML窗体。窗体将JavaScript函数和ASP.NET 按钮 (btnSubmit)以及HTML的onClick事件连接起来。在窗体被提交给服务器时,ASP.NET Button 中的onClick属性会通知系统调用哪些函数。

如果你是一名VB.NET开发人员,对于前面代码,只需要改变代码中的C#模块。VB.NET相应的代码如下:

1结合JavaScript与ASP.NET Web窗体进行程序开发<script language="vb" runat="server"
2结合JavaScript与ASP.NET Web窗体进行程序开发Private btnSearch_Click (sender As Object, e As System.EventArgs)
3结合JavaScript与ASP.NET Web窗体进行程序开发      Response.Write("Search")
4结合JavaScript与ASP.NET Web窗体进行程序开发End Sub
5结合JavaScript与ASP.NET Web窗体进行程序开发Private Page_Load(sender As Object, e As System.EventArgs)
6结合JavaScript与ASP.NET Web窗体进行程序开发      btnSubmit.Attributes.Add("onClick""return valSubmit();")
7结合JavaScript与ASP.NET Web窗体进行程序开发End Sub
8结合JavaScript与ASP.NET Web窗体进行程序开发/script>

功能强大的JavaScript和ASP.NET结合

JavaScript是面向用户网页开发的实用标准语言,它与ASP.NET Web窗体的结合,为开发人员提供了一个功能强大的用于构建稳固程序的工具集,而程序的稳固性被认为软件性能的一个关键组成部分。

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-01-10
  • 2021-11-06
  • 2021-12-07
  • 2021-09-11
  • 2021-06-28
猜你喜欢
  • 2021-06-09
  • 2021-07-10
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-05-22
相关资源
相似解决方案