详细说明按钮、链接按钮和图像按钮在ASP.NET的使用

ASP.NET框架包含三个向服务器提交表单的控件：按钮、链接按钮和图像按钮。这三个控件具有相同的功能，但是每个控件都有不同的界面。

本文将带您学习如何在页面中使用这三个控件。然后，学习如何将客户端脚本与服务器Button控件相关联，以及如何使用Button控件将表单传输到当前页面以外的页面。最后，学习如何处理Button控件的Command事件。

首先，使用按钮控件。

按钮控件用来向服务器提交表单的按钮。例如，清单1中的页面包含一个按钮控件。单击按钮控件更新标签控件显示的时间(参见图1)。

清单1 ShowButton.aspx

复制了以下代码： form id=' form 1 ' runat=' server ' div ASP : button id=' BTN submit ' text=' submit ' onclick=' BTN submit _ click ' runat=' server '/br/br/ASP : label id=' LBL time ' runat。

图1显示了按钮控件。

按钮控件支持以下属性(不完整列表):

AccessKey——指定了一个指向按钮控件的键。CommandArgument——用于指定传递给命令事件的命令参数。命令名——指定传递给命令事件的命令名。Enable——用于禁用按钮控件。OnClientClick——指定单击按钮时要执行的客户端脚本。PostBackUrl——用于设置要发送到页面的表单。制表符x——设置按钮控件的制表符顺序。文本——用于标记按钮控件。UseSubmitBehavior——用于使用JavaScript返回表单。

按钮控件支持以下方法：

Focus () ——用于将初始窗体焦点设置为Button控件。

按钮控件还支持以下两个事件：

单击按钮控件时引发的Click——。单击按钮控件时引发的命令——。命令名和命令组名被传递给此事件。

第二，使用链接按钮控件。

链接按钮控件与按钮控件一样，用于将表单发送回服务器。但是，与生成按钮的按钮控件不同，链接按钮控件生成链接。

清单2包含一个简单的表单。该表单包含一个LinkButton控件，用于向服务器提交表单并显示表单字段的内容(参见图2)。

清单2 ShowLinkButton.aspx

复制代码的代码如下： form id=' form 1 ' runat=' server ' diva sp :标签id=' LBL名字'文本='名字3360 '关联控件id=' txt名字' runat=' server '/br/asp: textbox id=' txtFirstName ' Runat=' server '/br/br/asp3360 label id=' lblLastName ' Text=' Last name : ' associated controlid=' txtLastName ' Runat=' server '/br/asp3360 Text box id=' txtLastName ' Runat=' server '/br/asp: link button id=' lnkSubmit ' Text=' Submit ' OnClick

图2显示了链接按钮控件。

在后台，LinkButton控件使用JavaScript将表单发送回服务器。链接按钮控件生成如下超链接：

复制的代码如下： a id=' lnksubmit ' href=' JavaScript 3360 _ _ dopostback(' lnksubmit '，' ')' submit/a。

单击链接按钮调用将表单发送回服务器的JavaScript _doPostBack()方法。提交表单时，所有表单字段的值也会返回到服务器。

链接按钮控件支持以下属性(不完整列表):

AccessKey——指定一个指向链接按钮控件的键。CommandArgument——用于指定传递给命令事件的命令参数。命令名——指定传递给命令事件的命令名。Enable——用于禁用链接按钮。OnClientClick——指定单击链接按钮时要执行的客户端脚本。PostBackUrl——用于设置要发送到页面的表单。TabIndex——设置链接按钮控件的Tab键顺序。Text——用于标记链接按钮控件。

按钮控件支持以下方法：

Focus () ——用于将初始窗体焦点设置为LinkButton控件。

按钮控件还支持以下两个事件：

单击链接按钮控件时引发的Click——。单击链接按钮控件时引发命令——。命令名和命令组名被传递给此事件。

第三，使用ImageButton控件。

ImageButton控件类似于Button和LinkButton控件，用于将表单发送回服务器。只有图像按钮控件始终显示图片。

清单3中的页面包含一个ImageButton控件，它将一个简单的表单发送回服务器(参见图3)。

代码3 ShowImageButton.aspx

复制代码的代码如下： form id=' form 1 ' runat=' server ' diva sp :标签id=' LBL名字'文本='名字3360 '关联控件id=' txt名字' runat=' server '/br/AsP : TextBox id=' TxtFirstName ' Runat=' server '/br/br/AsP :标签id='lblLastName' Text='姓氏： ' associated controlid=' TxtLastName ' Runat=' server '/br/AsP : TextBox id=' TxtLastName ' Runat=' server '/br/AsP 3360 image Button id=' btnSubmit ' imageURl=' Submit。

图3显示了ImageButton控件。

清单3中的ImageButton控件包含ImageUrl属性和AlternateText属性。ImageUrl属性包含由ImageButton控件显示的图片的路径。AlternateText属性用于为纯文本浏览器中的图片提供替代文本。

注意：可访问性标准要求每张图片都包含替代文本。此外，请记住，有些用户会关闭浏览器的图片功能，以获得更快的冲浪体验。

请注意，ImageButton控件的Click事件处理程序不同于其他两个按钮控件。传递给事件处理程序的第二个参数是ImageClickEventArgs类的一个实例。此类具有以下两个属性：

用户点击图片时的X—— x坐标。

Y——用户点击图片时的y坐标。

您可以使用ImageButton控件创建一个简单的图像映射。清单4中的页面包含一个显示目标图片的ImageButton控件。单击目标的中心，将显示一条成功消息(参见图4)。

代码4 ImageButtonTarget.aspx

复制的代码如下： form id=' form 1 ' Runat=' server ' diva sp : image button id=' BTN target ' image URL=' target . gif ' Runat=' server ' onclick=' BTN target _ click '/br/ASP : label id=' lblResult ' Runat=' server '/div/form

注意：ImageButton可用于创建服务器端映像映射。残疾人不能在服务器端使用图像映射。创建图像映射的最佳方式是使用用于创建客户端图像映射的图像映射控件。本章的下一节讨论ImageMap控件。

图4通过图像按钮检索X和Y坐标。

ImageButton控件支持以下属性(不完整的列表):

AccessKey——指定了一个指向ImageButton控件的键。AlternateText——为图片提供替代文本(可访问性要求)。DescriptionUrl——用于提供指向包含图片详细描述的页面的链接(复杂图片需要可访问)。CommandArgument——用于指定传递给命令事件的命令参数。命令名——指定传递给命令事件的命令名。Enable——用于禁用图像按钮。GenerateemptyAlternateText——为AlternateText属性设置一个空字符串值。ImageAlign——用于将图像与页面中的其他HTML元素对齐。的可能值为底部、中部、基线、底部、左侧、中部、底部、右侧、顶部和顶部。ImageUrl——用于指定图片的Url。OnClientClick——指定单击ImageButton时要执行的客户端脚本。PostBackUrl——用于设置要发送到页面的表单。TabIndex——设置ImageButton控件的制表符顺序。

ImageButton控件支持以下方法：

Focus () ——用于将初始窗体焦点设置为ImageButton控件。

ImageButton控件还支持以下两个事件：

单击ImageButton控件时引发的Click——。单击图像按钮控件时引发命令——。命令名和命令组名被传递给此事件。

第四，Button控件使用客户端脚本。

所有三个按钮控件都支持OnClientClick属性。单击按钮时，可以使用此属性执行所需的任何客户端代码。清单5中的页面显示了如何使用OnClientClick属性来显示确认对话框(参见图5)。

代码5 ButtonOnClientClick.aspx

复制的代码如下： form id=' form 1 ' runat=' server ' diva sp3360 button id=' btndelet ' text=' delete site ' onclick=' btndelet _ click ' onclient click=' return confirm('确定吗？');'Runat=' server '/br/br/asp3360标签id=' lblResult ' Runat=' server '/div/form

图5显示了客户端确认对话框。

清单5中的按钮控件包含一个OnClientClick属性，当客户端单击按钮时，该属性会执行一个JavaScript脚本。该脚本显示一个确认对话框。如果确认对话框返回False，按钮单击事件将被取消，并且包含该按钮的表单不会被发送回服务器。

像大多数ASP.NET控件一样，按钮控件支持扩展属性，并且可以通过简单地向控件添加任意属性来处理其他客户端事件。如果ASP.NET框架不识别控件上声明的属性，则框架将简单地将此属性传递给浏览器。

例如，清单6中的页面包含一个带有onmouseover和onmouseout属性的按钮控件。将鼠标悬停在按钮上，按钮上的文本将会改变。

清单6 ButtonExpando.aspx

复制的代码如下： form id=' form 1 ' runat=' server ' diva sp : button id=' BTN submit ' text=' submit ' on mouseover=' this。value='单击此处！' onmouseout=' this . value=' Submit ' ' Runat=' server '/div/form

注意：在Visual Web Developer中，扩展属性下会出现绿色波浪线警告，但忽略此警告是安全的。

5.执行跨页发送。

默认情况下，单击按钮控件会将包含该控件的页面提交回页面本身，并重新加载同一页面。但是，您可以使用PostBackUrl属性向其他页面提交表单数据。

例如，清单7包含一个搜索表单。该页中的按钮将该页提交给另一个名为ButtonSearchResult.aspx的页。代码8包含ButtonSearchResult.aspx页。

清单7 . button search . aspx

复制代码的代码如下： form id=' form 1 ' Runat=' server ' divasp : label id=' LBL搜索' Text=' search : ' Runat=' server '/asp: textbox id=' txtSearch ' Runat=' server '/asp3360 button id=' btnSearch ' Text=' Go！'post back URl=' button search results . aspx ' Runat=' server '/div/form

代码8 ButtonSearchResults.aspx

复制的代码如下：表单ID=' form 1 ' runat=' server ' div ASP 3360标签ID=' LBL搜索' runat=' server '/div/form。

在清单8中的Page_Load事件处理程序中，PreviousPage属性用于获取上一页的引用(清单7中的ButtonSearch.aspx页)。其次，使用FindControl()方法从上一页获取TextBox控件的txtSearch。最后，文本框中输入的值显示在页面的标签中。

作为使用FindControl()方法从上一页获取控件的替代方法，您可以通过页面属性公开该控件。清单9中的页面通过SearchString属性公开了TextBox txtSearch。该页面将表单数据发送到清单10中的ButtonSearchResultTyped.aspx页面。

清单9 ButtonSearchTyped.aspx

复制代码的代码如下： form id=' form 1 ' Runat=' server ' divasp : label id=' LBL搜索' Text=' search : ' Runat=' server '/asp: textbox id=' txtSearch ' Runat=' server '/asp3360 button id=' btnSearch ' Text=' Go！'postbackURl=' buttonsearcheresultstyped . aspx ' Runat=' server '/div/form

代码10 ButtonSearchResultTyped.aspx

复制的代码如下：表单ID=' form 1 ' runat=' server ' div ASP 3360标签ID=' LBL搜索' runat=' server '/div/form。

请注意，清单10中的页面包含%@ PreviousPageType%指令。此指令将PreviousPage属性返回的值转换为ButtonSearchTyped类的实例。如果没有此指令，PreviousPage属性将返回前一页作为常规页类的实例。

执行跨页提交时，可以使用以下两种方法之一。第一个方法提供弱类型方法来获取上一页的值，第二个方法提供强类型方法。

六、指定默认按钮。

您可以使用服务器端窗体控件的默认按钮属性来指定窗体的默认按钮。指定一个默认按钮，您可以按键盘上的回车键来调用该按钮。

例如，清单11中的页面包含一个简单的搜索表单。表单标签设置页面的默认按钮是按钮控件的搜索。

清单11 . button default button . aspx

复制代码的代码如下： form id=' form 1 ' default button=' BTN search ' runat=' server ' diva sp :标签id=' lblsearch' text=' search3360 '关联控件id=' lblsearch。h ' Runat=' server '/AsP : TextBox id=' TxtSearch ' Runat=' server '/AsP : Button id=' BtSearch ' Text=' Search ' OnClick=' BtSearch _ Click ' Runat=' server '/AsP : Button id=' BtEncel ' Text=' Cancel ' Runat=' server '/HR/AsP : Abel id=' LBlresult ' Runat=' server '/div/form

打开清单11中的页面，输入搜索词，点击键盘上的回车键，表单将被提交给服务器。由于搜索按钮是页面上的默认按钮，单击键盘上的回车键将执行搜索_单击()事件处理程序。

注意：您也可以为面板控件指定默认按钮。本章稍后将讨论面板控件。

七.处理命令事件。

所有三个按钮控件都支持单击事件和命令事件。这两个事件之间的区别在于，命令名称和命令参数可以传递给命令事件处理程序，但不能传递给单击事件处理程序。

例如，清单12中的页面包含两个Button控件和一个BulletedList控件。点击第一个按钮，BulletedList控件显示的项目按正序排列；单击第二个按钮，BulletedList控件显示的项目以相反的顺序排列(见图6)。

两个按钮控件都包含命令名称和命令名称属性。此外，这两个按钮控件还与Sort_Command()事件处理程序相关联。当决定BulletedList控件的元素如何排序时，事件处理程序会检查CommandName和CommandArgument属性。

代码12 ButtonCommand.aspx

复制代码的代码如下： form id=' form 1 ' runat=' server ' diva sp : button id=' btsentasc ' text=' sort ASC ' command name=' sort ' command gument=' ASC ' on command=' sort。_ Command ' Runat=' server '/asp: button id=' btsentdesc ' Text=' Sort desc ' Command name=' Sort ' Command gument=' desc ' on Command=' Sort _ Command ' Runat=' server '/br/br/asp: bulletedlist id=' bltGroceries ' Runat=' server '/div/form

图6处理命令事件。