ASP.NET基础 专题
您的位置:csharp > ASP.NET基础专题 > ASP.NET HTML服务器
ASP.NET HTML服务器
作者:--    发布时间:2019-11-20

html服务器控件基本上是为了启用服务器端处理而增强的标准html控件。 html控件(如标题标签,定位标签和输入元素)不由服务器处理,而是发送给浏览器进行显示。

它们通过添加属性runat =“server”并添加一个id属性专门转换为服务器控件,以使它们可用于服务器端处理。

例如,考虑html输入控件:

<input type="text" size="40">

可以通过添加runatid属性将其转换为服务器控件:

<input type="text" id="testtext" size="40" runat="server">

注意: 理解上面代码机制,有助使用asp和html标签。

使用html服务器控件的优点

尽管asp.net服务器控件可以执行由html服务器控件完成的每项工作,但以下控件在以下情况下非常有用:

  • 使用静态表格进行布局。
  • 将html页面转换为在asp.net下运行

下表介绍了html服务器控件:

编号 控件名称 html标签
1 htmlhead <head>
2 htmlinputbutton <input type=button/submit/reset>
3 htmlinputcheckbox <input type=checkbox>
4 htmlinputfile <input type = file>
5 htmlinputhidden <input type = hidden>
6 htmlinputimage <input type = image>
7 htmlinputpassword <input type = password>
8 htmlinputradiobutton <input type = radio>
9 htmlinputreset <input type = reset>
10 htmltext `<input type = text password>`
11 htmlimage <img>元素
12 htmllink <link>元素
13 htmlanchor <a>元素
14 htmlbutton <button>元素
15 htmlform <form>元素
16 htmltable <table>元素
17 htmltablecell <td><th>元素
18 htmltablerow <tr>元素
19 htmltitle <title>元素
20 htmlselect <select>元素
21 htmlgenericcontrol 所有没有列出的html控件

示例

以下示例使用基本的html表格进行布局。 它使用了一些用于从用户获得输入的框,例如名称,地址,城市,省份等。它还具有按钮控制,点击该按钮以获取在表格的最后一行中显示的用户数据。

打开visual studio,创建一个空的网站项目:httpserver,参考以下图片 -

并向这个项目中添加一个web窗体,存储文件名称为:default.aspx 。页面在设计视图中看起来像这样:

内容页面的代码显示了使用html表格元素进行布局。参考以下代码 -

<%@ page language="c#" autoeventwireup="true" codefile="default.aspx.cs" inherits="_default" %>

<!doctype html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>用户表单</title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <table>
                <tr>
                    <td>名字:</td>
                    <td>
                        <asp:textbox id="txtname" runat="server"></asp:textbox>
                    </td>
                </tr>

                <tr>
                    <td>地址:</td>
                    <td>
                        <asp:textbox id="txtstreet" runat="server"></asp:textbox>
                    </td>
                </tr>

                <tr>
                    <td>城市:</td>
                    <td>
                        <asp:textbox id="txtcity" runat="server"></asp:textbox>
                    </td>
                </tr>

                <tr>
                    <td>省份:</td>
                    <td>
                        <asp:textbox id="txtstate" runat="server"></asp:textbox>
                    </td>
                </tr>
                <tr>
                  <td class="style1"></td>
                  <td id="displayrow" runat ="server" class="style2">
                  </td>
               </tr>
                <tr>
                    <td colspan="2">

                        <asp:button id="button1" runat="server" text="提交" onclick="button1_click" />

                    </td>

                </tr>

            </table>
        </div>
    </form>
</body>
</html>

按钮控件后端的代码(default.aspx.cs):

using system;
using system.collections.generic;
using system.linq;
using system.web;
using system.web.ui;
using system.web.ui.webcontrols;

public partial class _default : system.web.ui.page
{
    protected void page_load(object sender, eventargs e)
    {

    }

    protected void button1_click(object sender, eventargs e)
    {
        string str = "";
        str += txtname.text + "<br />";
        str += txtstreet.text + "<br />";
        str += txtcity.text + "<br />";
        str += txtstate.text + "<br />";
        displayrow.innerhtml = str;
    }
}

运行上面代码,得到以下结果 -

填入上述表单内容,然后提交 -

注意以下几点:

  • 标准的html标签可用于页面布局。
  • html表格的最后一行用于数据显示。 它需要服务器端处理,所以id属性和runat属性需要添加到标签中。

网站声明:
本站部分内容来自网络,如您发现本站内容
侵害到您的利益,请联系本站管理员处理。
联系站长
373515719@qq.com
关于本站:
编程参考手册