HTML CSS JAVASCRIPT BOOTSTRAP JQUERY PHP SQL PYTHON PYTHON2 JAVA C C++ C# Linux AI 教程库 参考手册 测验 练习 HOWTO FAQ
❮ 上一节 下一节 ❯

ASP.NET - 客户端

ASP.NET 客户端编码有两个方面:

  • 客户端脚本：它在浏览器上运行，从而加快页面的执行速度。 例如，客户端数据验证可以捕获无效数据并相应地警告用户，而无需往返服务器。

  • 客户端源代码：ASP.NET 页面生成此代码。 例如，ASP.NET 页面的 HTML 源代码包含许多隐藏字段和自动注入的 JavaScript 代码块，这些代码块保留视图状态等信息或执行其他工作以使页面正常工作。

客户端脚本

所有 ASP.NET 服务器控件都允许调用使用 JavaScript 或 VBScript 编写的客户端代码。 某些 ASP.NET 服务器控件使用客户端脚本向用户提供响应，而无需发回服务器。 例如，验证控件。

除了这些脚本之外，Button 控件还有一个属性 OnClientClick，它允许在单击按钮时执行客户端脚本。

传统和服务器 HTML 控件具有以下事件，这些事件在引发时可以执行脚本:

事件 描述
onblur 当控件失去焦点时
onfocus 当控件获得焦点时
onclick 单击控件时
onchange 当控件的值发生变化时
onkeydown 当用户按下某个键时
onkeypress 当用户按下字母数字键时
onkeyup 当用户释放按键时
onmouseover 当用户将鼠标指针移动到控件上时
onserverclick 当单击控件时，它会引发控件的 ServerClick 事件

客户端源代码

我们已经讨论过，ASP.NET页面通常写在两个文件中:

  • 内容文件或标记文件 (.aspx)
  • 代码隐藏文件

内容文件包含 HTML 或 ASP.NET 控制标记和文字，以形成页面的结构。 代码隐藏文件包含类定义。 在运行时，内容文件被解析并转换为页面类。

该类与代码文件中的类定义以及系统生成的代码一起构成可执行代码（程序集），用于处理所有发布的数据、生成响应并将其发送回客户端。

考虑简单的页面:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" 
   Inherits="clientside._Default" %>

<!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 runat="server">
      <title>
         Untitled Page
      </title>
   </head>
   
   <body>
      <form id="form1" runat="server">
      
         <div>
            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>  
            <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Click" />
         </div>
         
         <hr />
         
         <h3> <asp:Label ID="Msg" runat="server" Text=""> </asp:Label> </h3>
      </form>
   </body>
   
</html>

当此页面在浏览器上运行时，"查看源代码"选项将显示 ASP.Net 运行时发送到浏览器的 HTML 页面：

<!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>
      <title>
         Untitled Page
      </title>
   </head>
   
   <body>
      <form name="form1" method="post" action="Default.aspx" id="form1">
      
         <div>
            <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" 
               value="/wEPDwUKMTU5MTA2ODYwOWRk31NudGDgvhhA7joJum9Qn5RxU2M=" />
         </div>
 
         <div>
            <input type="hidden" name="__EVENTVALIDATION"  id="__EVENTVALIDATION" 
               value="/wEWAwKpjZj0DALs0bLrBgKM54rGBhHsyM61rraxE+KnBTCS8cd1QDJ/"/>
         </div>

         <div>
            <input name="TextBox1" type="text" id="TextBox1" />  
            <input type="submit" name="Button1" value="Click" id="Button1" />
         </div>

         <hr />
         <h3><span id="Msg"></span></h3>
         
      </form>
   </body>
</html>

如果正确浏览代码，您可以看到前两个 <div> 标签包含存储视图状态和验证信息的隐藏字段。

❮ 上一节 下一节 ❯