250 likes | 606 Views
第四章 HTML 控件和 Web 服务器控件. 褚龙现 chulongxian@126.com. 回顾内容. HTML 控件特点 HTML 控件属性. 回顾 -- HTML 控件. HTML 控件外观上与普通的 HTML 标记很相似,由 HTML 标记衍生而来,属于 System.Web.UI.HtmlControls 命名空间,并在 ASP.NET 页中声明为一个由 runat=“server” 属性标记的 HTML 元素。. 回顾 -- HTML 控件的优点. HTML 标记加上 runat=server 属性后,即可变为 HTML 控件。
E N D
第四章 HTML控件和Web服务器控件 褚龙现 chulongxian@126.com 软件学院
回顾内容 • HTML控件特点 • HTML控件属性 软件学院
回顾-- HTML控件 • HTML控件外观上与普通的HTML标记很相似,由HTML标记衍生而来,属于System.Web.UI.HtmlControls命名空间,并在ASP.NET页中声明为一个由runat=“server”属性标记的HTML元素。 软件学院
回顾-- HTML控件的优点 • HTML标记加上runat=server属性后,即可变为HTML控件。 • HTML控件将HTML标记对象化,其属性可以由程序直接控制。 • HTML控件支持事件处理,可以以事件触发方式来编写程序。 软件学院
回顾–HTML控件常用属性 • Style属性 • Attributes属性 • Visible属性 • Disabled属性 • InnerHtml属性 • InnerText属性 软件学院
1Style属性 • Style属性可以设定的样式: 软件学院
2 Attributes属性 • Attributes属性使用注意事项 • 对于有些控件指定的属性不合法 • 指定的属性不是对应HTML标记所支持的 软件学院
教学目标 • 掌握常用HTML控件 软件学院
教学重难点 • 重点 • HTML控件应用 • 难点 • HTML控件各个属性 软件学院
4.2 基本HTML控件 • HtmlTextArea控件 • HtmlTable控件 • HtmlImage控件 • HtmlSelect控件 • HtmlInput控件 软件学院
4.2.1HtmlTextArea控件 • 该控件可以在Web页上创建多行文本框。多行文本框的高度和宽度可以通过rows和cols属性控制,设置或获取多行文本框的文本内容,使用的是Value属性。 软件学院
4.2.2HtmlTable控件 • 该控件用来生成表。可以使用HtmlTable、HtmlTableRow、HtmlTableCell控件来自由地控制表格的行、列数。将创建好的行添加到表的Rows集合中,将创建好的单元格,添加到行的Cells集合中,形成表。 软件学院
4.2.3HtmlImage控件 • 实用HtmlImage控件可以在Web页上显示图像,并且可以通过编程动态控制显示图像的大小、图像相对于其他控件的对齐方式以及更改图像本身。 软件学院
4.2.3HtmlImage控件 • HtmlImage控件的主要属性有: • Src属性:图像文件 • Align属性:对齐方式 • Alt属性:无法加载时,显示文字 • Border属性:图像边界宽度 • Height、Width属性:长、宽值 软件学院
4.2.4HtmlSelect控件 • 使用该控件创建选择框,通过将<option>元素放在开始和结束<select>标记之间来指定控件中的项列表。 • ListItem的Text属性用于指定显示的文本,Value属性用于将一个不同于文本的值与该项关联。 软件学院
4.2.4HtmlSelect控件 • Size属性用于控制该控件的高度,Multiple属性用于控制该控件是否可以多选。 • SelectedIndex属性用于获取选定项的索引,可以从Items集合中检索该项。 软件学院
4.2.5HtmlInput控件 • HtmlInput控件根据Type属性的设定产生不同种类的控件。 • HtmlInputButton控件 • HtmlInputCheckBox控件 • HtmlInputText控件 • HtmlInputHidden控件 • HtmlInputRadioButton控件 • HtmlInputFile控件 软件学院
1HtmlInputButton控件 • 根据type属性的不同设置,可以创建命令按钮、提交按钮和重置按钮。 • 用户单击HtmlInputButton控件时,嵌有该控件的窗体输入被送到服务器并得到处理,然后将处理结果发送回请求浏览器。 • 重置按钮不支持ServerClick事件。 软件学院
2HtmlInputCheckBox控件 • 单击该控件时,不会向服务器回送。当使用回送服务器控件时,复选框的状态被发送到服务器进行处理。 • Checked属性用于获取或设置是否选中该复选框。 • OnServerChange方法只有提交页面同时当更改了选择状态时发生。 软件学院
3HtmlInputText控件 • 单行文本框,当type属性为password时屏蔽文本框内容。 • 使用MaxLength、Size和Value属性,可以控制文本框输入的最大字符数、文本框宽度和文本框的内容。 软件学院
4HtmlInputHidden控件 • 此控件是窗体的一部分,但永远不在窗体上显示。此控件通常与HtmlInputButton和HtmlInputText控件一起使用,以在对服务器的发送之间存储信息。 软件学院
5HtmlInputRadioButton控件 • 此控件在Web页上创建单选按钮。有两个重要属性。 • Name属性:用于获取或设置HtmlInputRadioButton关联的组的名称,多个控件设置同一个name属性,可以实现互相排斥功能。 • Checked属性:获取或设置单选按钮是否被选中。 软件学院
5HtmlInputRadioButton控件 • 此控件不会自动向服务器回送。必须依赖使用某个按钮控件来回送到服务器。 • ServerChange事件只为更改成选中状态的单选按钮引发。 软件学院
6HtmlInputFile控件 • HtmlInputFile可以用来向服务器端上传文件。 • 要使得文件上载能够成功,需要满足: • 1.控件必须出现在Form元素中 • 2.必须为该控件指定Name标签属性的值 • 3.form元素的method属性值必须为post • 4.form元素的enctype标签属性值为multipart/form-data 软件学院
下次课内容 • Web服务器控件 软件学院