asp.net(C#)实践教程

第4章HTML控件 内容摘要 HTML控件是ASP NET所提供的在服务器端执行的组件 可以产生标准的HTML文件 一般说来 标准的HTML标签无法动态控制其属性 使用方法 接收事件 必须使用其他的程序语言来控制标签 这对于使用ASP程序设计来说很不方便 而且会使ASP程序比较杂乱 ASP NET在这方面开发了新的技术 即将HTML标签对象化 使程序 如VisualBasic NET C 等 可以直接控制HTML标签 对象化后的HTML标签称之为HTML控件 学习目标 了解HTML的语法掌握HTML控件的公共属性熟悉HTML控件的属性掌握HTML各控件的使用方法 4 1HTML控件简介 ASP NET为动态网页程序设计带来了许多新的技术 这些技术其中之一就是将所有的HTML标记对象化 让程序可以直接控制 对象化之后的HTML标记称为HTML控件 可以使用如C 或者VB NET等语言来撰写控制HTML控件的程序 ASP NET把HTML标记对象化 可以让网页对象的互动 程序的写作及维护变的更轻松容易 也让执行的效率明显的改善不少 4 1 1HTML控件介绍 控件是一个可重用的组件或者对象 有自己的属性和方法 可以响应事件 控件的基本属性定义自身的显示外观 在ASP NET中 控件是组成ASP NET页面内容的主要元素 增强和扩展了Web页面的功能和处理能力 规范了Web页面的代码 简化了Web页面的设计难度和设计过程 根据控件定义及作用 ASP NET中的控件可分为HTML控件 Web服务器控件 验证控件和用户自定义控件 HTML控件又包括HTML常用服务器控件和与表单有关的控件 常用HTML控件和与表单有关的控件详见表4 1 4 1 1HTML控件介绍 表4 1常用HTML控件与表单控件 4 1 2HTML控件的语法 本节中的主题描述如何使用VisualWebDeveloper工具箱的HTML选项卡上的ASP NETWeb服务器控件 默认情况下 服务器无法使用ASP NET网页上的HTML元素 这些元素被视为传递给浏览器的不透明文本 但是 通过将HTML元素转换成HTML服务器控件 可以将其公开为可以在基于服务器的代码中进行编程的元素 HTML控件由HTML标记衍生而来 由于HTML标记的属性只能静态地设置 一般在程序执行过程中不能被修改 很不灵活 为了弥补这一不足 ASP NET特别提供HTML控件 这种控件即允许在程序中设置其属性 也允许在程序的执行过程中动态地读取及修改其属性 从而可以产生动态的网页 4 1 2HTML控件的语法 下面来看一个HTML标记和HTML控件比较的例子客户端服务器端比较这两个语句 可以看出声明一个HTML服务器按钮控件和声明一个HTML普通按钮控件有以下几点不同 服务器按钮控件用id属性代替了普通按钮控件的name属性 服务器按钮控件用OnServerClick属性代替了普通按钮控件的OnClick属性 服务器按钮控件多用了一个属性runat server 4 1 2HTML控件的语法 ID属性是标识服务器控件的惟一标志 通过ID可以像引用一个对象一样来直接在服务器端引用服务器控件 ID属性表示程序以本属性来控制对象 所以任何对象的名称不可重复 不管是否为同一种类 用OnServerClick属性代替OnClick属性是为了表明响应按钮的单击事件是在服务器端进行处理 而不是客户端 多出的runat server 属性是说明该控件为服务器控件 这时区别HTML控件是服务器控件还是普通控件的惟一方法 4 2HTML控件的公共属性 所有的HTML控件都根据控件在表单中的用途可分为HTML输入控件和HTML容器控件 各个HTML控件都有自身的属性 并且各个HTML控件之间又存在着很多共同的属性 在HTML的所有控件中都包含Attributes Disabled Style TagName Visible等属性 HTML输入控件除共享所有HTML控件共享属性外还共享Name Value和Type属性 HTML容器控件除共享所有HTML控件共享属性外还共享InnerHtml和Value属性 4 2 1Attributes属性 HtmlControl Attributes属性位于命名空间System Web UI HtmlControls下 用于获取在ASP NET页内的服务器控件标记上表示的所有属性 Attribute 名称和值对的集合 使用该属性可以用编程方式访问HTML服务器控件的特性 所有Html服务器控件都将其特性存储在Control ViewState中 语法如下 BrowsableAttribute false publicAttributeCollectionAttributes get 4 2 2Disabled属性 HtmlControl Disabled属性位于命名空间System Web UI HtmlControls下 用于获取或者设置一个值 该值指示HTML服务器控件是否被禁用 语法如下 属性值 如果该控件被禁用 则为true 否则为false 默认值为false 4 2 3InnerHtml属性 HtmlControl InnerHtml属性位于命名空间System Web UI HtmlControls下 用于获取或者设置位于指定的HTML服务器控件的开始标记和结束标记之间的内容 InnerHtml属性自动对进出HTML实体的特殊字符进行编码 HTML实体允许显示特殊字符 例如属性值 HTML服务器控件的开始标记和结束标记之间的HTML内容 4 2 4InnerText属性 HtmlContainerControl InnerText属性位于命名空间System Web UI HtmlControls下 用于获取或者设置指定HTML服务器控件的开始标记和结束标记之间的文本 与InnerHtml属性不同 InnerText属性不会对自动进出HTML实体的特殊字符进行编码 语法如下 属性值 HTML服务器控件的开始标记和结束标记之间的文本 4 2 5Style属性 HtmlControl Style属性属性位于命名空间System Web UI HtmlControls下 用于获取应用于ASP NET文件中指定的HTML服务器控件的所有级联样式表 CSS 属性 Property 的集合 语法如下 BrowsableAttribute false publicCssStyleCollectionStyle get 属性值 包含HTML服务器控件的样式属性 Property 4 2 6Value属性 HtmlInputControl Value属性位于命名空间System Web UI HtmlControls下 用于获取或者设置与HtmlInputControl控件关联的值 语法如下 属性值 与HtmlInputControl控件关联的值 4 3HTML控件及其属性 默认情况下 ASP NET文件中的HTML元素作为文本进行处理 并且不能在服务器端代码中引用这些元素 若要使这些元素能以编程方式进行访问 可以通过添加runat server 属性表明应将HTML元素作为服务器控件进行处理 还可以设置元素的id属性 使开发人员可以通过编程方式引用控件 然后可以通过设置属性 Attribute 来声明服务器控件实例上的属性 Property 参数和事件绑定 4 3 1HtmlAnchor控件 使用HtmlAnchor控件以编程方式控制HTML元素 使用HTML元素可以创建允许移到页上的其他位置或者其他网页的超链接 HtmlAnchor控件必须使用带有开始和结束标记的正确格式 可以通过将文本放置在开始和结束标记之间来指定控件标题 此服务器控件通常用于动态修改元素的属性 Attribute 和属性 Property 显示来自数据源的超链接以及控制事件以动态生成HtmlAnchor控件 4 3 1HtmlAnchor控件 格式如下 超级链接文字 4 3 2HtmlForm控件 使用HtmlForm控件可以对HTML元素进行编程 若要利用回发服务 则所有Web窗体控件 无论HTML件 Web控件 用户控件还是自定义控件 都必须嵌套在HtmlForm控件的格式良好的开始标记和结束标记之间 如果没有正确结束标记 ASP NET将无法识别该元素 该元素将被忽略或者将发生编译错误 具体取决于该元素的构成方式 4 3 2HtmlForm控件 格式如下 其他控件 4 3 3HtmlButton控件 使用HtmlButton控件可以对HTML元素进行编程 可以为HtmlButton控件的ServerClick事件提供自定义代码 以指定在单击该控件时执行的操作 HtmlButton控件将JavaScript呈现到客户端浏览器 客户端浏览器必须启用了JavaScript 此控件才能正常运行 HtmlButton控件必须写在窗体控件之内 这是因为Button控件可以决定数据的上传 而只有被控件所包围起来的数据输入控件 其数据才会被上传 4 3 3HtmlButton控件 格式如下 按钮上的文字 图形或者控件 4 3 4HtmlTable HtmlTableRow和HtmlTableCell控件 若要创建表 首先应在页上的窗体中声明一个HtmlTable控件 然后 将HtmlTableRow对象放置在HtmlTable控件的开始和结束标记之间 对于表中所需的每一行放置一个对象 定义表中的行之后 声明位于每个HtmlTableRow对象的开始和结束标记之间的HtmlTableCell对象以创建该行的单元格 4 3 4HtmlTable HtmlTableRow和HtmlTableCell控件 1 HtmlTable控件使用HtmlTable控件对HTML元素进行编程 HtmlTable控件由一些行组成 由HtmlTableRow对象表示 这些行存储在表的Rows集合中 每行均由存储在行的Cells集合中的单元格 由HtmlTableCell对象表示 组成 HtmlTable控件允许自定义表的外观 通过设置BgColor Border BorderColor Height和Width属性 可以分别指定表的背景色 边框宽度 边框颜色 表高度和表宽度 通过设置CellSpacing和CellPadding属性 还可以控制单元格间的间距以及单元格内容与单元格边框间的间距 4 3 4HtmlTable HtmlTableRow和HtmlTableCell控件 格式如下 4 3 4HtmlTable HtmlTableRow和HtmlTableCell控件 2 HtmlTableRow控件使用HtmlTableRow类对HTML元素进行编程 元素表示表中的行 HtmlTableRow类使可以控制表中各个独立行的外观 通过设置BgColor BorderColor和Height属性 可以分别控制行的背景色 边框颜色和高度 通过设置Align和VAlign属性 分别控制行中单元格内容的水平和垂直对齐方式 表中的每行都包含一个Cells集合 该集合对于该行中的每个单元格都包含一个HtmlTableCell HtmlTableRow属性 4 3 4HtmlTable HtmlTableRow和HtmlTableCell控件 格式如下 EnableViewState False True Id 被程序代码所控制的名称 runat server cellcontentcellcontentcellcontent 4 3 4HtmlTable HtmlTableRow和HtmlTableCell控件 3 HtmlTableCell控件使用HtmlTableCell类对和HTML元素进行编程 元素表示数据单元格 而元素表示标题单元格 HtmlTableCell类可以控制各个独立单元格的外观 通过设置BgColor BorderColor Height和Width属性 可以分别控制单元格的背景色 边框颜色 高度和宽度 4 3 4HtmlTable HtmlTableRow和HtmlTableCell控件 格式如下 CellContent 4 3 5表单输入控件 1 HTMLInputText控件HtmlInputText控件用来控制和元素 在HTML中 这两个元素用来建立文本域和密码域 格式如下 4 3 5表单输入控件 2 HTMLInputImage控件使用HtmlInputImage控件可以对HTML元素进行编程 可以将此控件与HtmlInputText Htm