在HTML中称“元素”,添加了“runat=‘server’”后称控件,后台服务端可以控制

想要后台改变前端的控件,需要先让后台获取前端控件

常用的简单的表单元素(控件)

==================================================

1、label —— span

label 经过编译后,在HTML中为span

常用属性:

  ★Text:要显示的文字内容 —— <span>要显示的文字内容</span>

  ★CssClass:指向的Class属性

<asp:Label ID="Label1" runat="server" Text="" CssClass="aaa"></asp:Label>

网页展示:  HTML编码:

  height:高度

  width:宽度

  enabled:控件是否启用,但对label无效

  visible:控件是否可见,编译后无代码

编译前:

        <asp:Label ID="Label1" runat="server" Text="" CssClass="aaa" Height="" Width="" BackColor="#FF99CC" BorderColor="#FF3300" BorderStyle="Solid" BorderWidth=""></asp:Label>

 

编译后: 

<span id="Label1" class="aaa" style="display:inline-block;background-color:#FF99CC;border-color:#FF3300;border-width:5px;border-style:Solid;height:100px;width:100px;"></span>

如果有多个相同的label,则会出现代码冗余,影响数据传输

使用<style ></style>

减少代码,减少流量,加快传输

==================================================

2、★★★★★Lateral - 向前端返回代码

Lateral 编译后会把其 text 原封不动的展示出来

常用属性:

  text:可以是文字,也可以是要执行的代码(李献策lxc)

比如:

<asp:Literal ID="Literal1" runat="server" Text="2016-12-29"></asp:Literal>

网页展示  编译后

比如:

<asp:Literal ID="Literal1" runat="server" Text="<script>alert('2016年12月29日')</script>"></asp:Literal>

网页展示  编译后

练习1:

点击按钮,弹出提示,提示文本框是否为空

<%@ 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>
<style type="text/css"> .aaa {
display:inline-block;background-color:#FF99CC;border-color:#FF3300;border-width:5px;border-style:Solid;height:100px;width:100px;
} </style>
</head>
<body>
<form id="form1" runat="server">
<div> <%-- <asp:Label ID="Label1" runat="server" Text="" CssClass="aaa"></asp:Label> --%> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" /> <asp:Literal ID="Literal1" runat="server" ></asp:Literal> </div>
</form>
</body>
</html>

前端代码

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)
{
Button1.Click += Button1_Click;
}
//按钮点击事件
void Button1_Click(object sender, EventArgs e)
{
if (TextBox1.Text.Length > )
{
Literal1.Text = "<script>alert('内容不为空!');</script>";
}
else
{
Literal1.Text = "<script>alert('空!');</script>";
}
}
}

后台代码

  

练习2:

public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
Button1.Click += Button1_Click;
}
//按钮点击事件
void Button1_Click(object sender, EventArgs e)
{
for (int i = ; i < ; i++)
{
Literal1.Text += "<span class='aaa'>" + i + "</span>";
}
}
}

打印多个span

页面展示

编译代码

==============================================================

3、textbox - text、password、textarea

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

属性:

  ★★★TextMode - text模式

    1、默认 SingleLine - 单行文本框,编译后为 type="text"

    2、Password - 密码框,编译后为 type="password"

    3、MultiLine - 文字域,编译后为 <textarea></textarea>

    在设计界面中 textmode 属性有多个,只用前三个

  maxlength:最大长度,在文本域 <textarea></textarea> 中不起作用

  readonly:只读属性(李献策lxc)

==============================================================

4、hiddenfield - hidden 隐藏域

<asp:HiddenField ID="HiddenField1" runat="server" />
<input type="hidden" name="HiddenField1" id="HiddenField1" />

==============================================================

5、button - submit 提交

imagebutton - image 提交图片

linkbutton - 超链接模样的按钮,仅控件如此

button、reset - 没有控件对应

编译前

<asp:Button ID="Button1" runat="server" Text="Button" />

<asp:ImageButton ID="ImageButton1" runat="server" />

<asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton>

编译后

<input type="submit" name="Button1" value="Button" id="Button1" />

<input type="image" name="ImageButton1" id="ImageButton1" src="" />
<a id="LinkButton1" href="javascript:__doPostBack('LinkButton1','')">LinkButton</a>

button属性:

  ★★★OnClientClick - 在客户端OnClick上执行的客户端脚本

<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick='alert("haha")' />
<input type="submit" name="Button1" value="Button" onclick="alert(&quot;haha&quot;);" id="Button1" />

客户端脚本执行优先级高,即先弹窗再执行其他操作

C#-WebForm-简单控件的更多相关文章

  1. WebForm简单控件,复合控件

    简单控件: 1.Label 会被编译成span标签 属性: Text:文本内容 CssClass:CSS样式 Enlabled:是否可用 Visible:是否可见 __________________ ...

  2. webform简单控件

    表单元素: 文本类: text password textarea hidden text,password,textarea实现控件:textbox   textmode属性选择password或m ...

  3. WebForm 简单控件、复合控件

    简单控件: Label:被编译成span 样式表里设置lable的高度:  display:inline-block; Text  --文本 ForeColor  --字体颜色 Visible  -- ...

  4. webform 简单控件

    html中12个表单元素添加runat="server"后称为控件 Lable 编译之后是 <span></span> 属性:CssClass  编译成 c ...

  5. Webform(简单控件、复合控件)

    一.简单控件: 1.label控件 <asp:Label ID="Label1" runat="server" Text="账 号:" ...

  6. WebForm 【简单控件】【表单元素】

    一.HTML 表单元素复习 (1)文本类 文本框:<input type="text" name="" id="" value=&qu ...

  7. 【2017-05-18】WebForm的Repeater控件和一些简单控件

    一.Repeater控件 1. <%@ %> - 这里面写一些声明和引用的 <%  %> - 编写C#代码的 <%= %> - 往界面上输出一个变量的值 <% ...

  8. 【2017-05-18】WebForm的Repeater控件及简单控件

    <%@ %> - 这里面写一些声明和引用的 <%  %> - 编写C#代码的 <%= %> - 往界面上输出一个变量的值 <%# Eval("属性名 ...

  9. 2013 duilib入门简明教程 -- 简单控件介绍 (12)

        前面的教程应该让大家对duilib的整体有所映像了,下面就来介绍下duilib具体控件的使用.     由于官方没有提供默认的控件样式,所以我就尽量使用win7或者XP自带的按钮样式了,虽然界 ...

  10. WebForm 常用控件

    一.简单控件 1.Label(作用:显示文字) Web中: <asp:Label ID="Label1" runat="server" Text=&quo ...

随机推荐

  1. 浅谈Collection集合

    俗话说:一个东西,一件事都离不开三句话:"是什么,为什么,怎么办" 集合是什么: 集合简单的说一个数组集合的高级体现,用来存储数据或对象的容器: 集合为什么存在: 集合只是体现了对 ...

  2. Atitit.ide技术原理与实践attilax总结

    Atitit.ide技术原理与实践attilax总结 1.1. 语法着色1 1.2. 智能提示1 1.3. 类成员outline..func list1 1.4. 类型推导(type inferenc ...

  3. 在xampp中配置dvwa

    DVWA主要是用于学习Web的常见攻击,比如SQL注入.XSS等的一个渗透测试系统,下面我将结合XAMPP来说明它的安装过程. 一.环境 OS:Windows 10 XAMPP:5.6.24 DVWA ...

  4. Android 绘制view的小知识点

    [onMeasure] 直接继承view或ViewGroup的自定义控件需要重写onMeasure方法并设置wrap_content时的自身大小,否则在布局中使用wrap_content就相当于mat ...

  5. 【搬砖】安卓入门(4)- Java开发编程基础--数组

    05.01_Java语言基础(数组概述和定义格式说明)(了解) A:为什么要有数组(容器) 为了存储同种数据类型的多个值 B:数组概念 数组是存储同一种数据类型多个元素的集合.也可以看成是一个容器. ...

  6. 解读AppIcon图标设置置信息和App内存警告临界值

    前面有同学问到了iOS内存警告临界值和工程项目里AppIcon的一些配置信息,相信对刚入行的同学来说,可能都会碰到类似的问题,记录一下供后来者查询. 1.先简单说下AppIcon的图标的配置信息 1) ...

  7. IOS 网络浅析-(十一 三方 AFNetworking3.0简介)

    AFNetworking3.0是目前最新的版本,本来打算介绍一下2.6,但是想想2.6名不久矣,就决定不介绍了,有兴趣的小伙伴可以上网查一查.下面我就开始进入正题了. 目前使用人数最多的第三方网络库, ...

  8. pc端与移动端的区别

    移动设备和PC本身有区别: 1.屏幕尺寸不同,屏幕大小导致显示的内容页不一样. 2.网络速度不同:手机分2G.3G.4G.WIFI等,我们要少用图片,JS.动画等等,用户打不开一样起不了作用. 3.使 ...

  9. GitHub + VSTS 开源代码双向同步

    GitHub已经是全球开源代码的大本营了,通过以下统计你可以看到仅仅javascript在github就有超过32万个活动的repo.很多开发人员都会把自己的一部分代码分享到github上进行开源,一 ...

  10. java中 String StringBuffer StringBuilder的区别

    * String类是不可变类,只要对String进行修改,都会导致新的对象生成. * StringBuffer和StringBuilder都是可变类,任何对字符串的改变都不会产生新的对象. 在实际使用 ...