form(1)

form表单有什么作用?有哪些常用的input 标签,分别有什么作用?

1.HTML <form> 元素 表示了文档中的一个区域,这个区域包含有交互控制元件,用来向web服务器提交信息,拥有以下属性。

  1. action 一个处理这个form信息的程序所在的URL。
  1. autocomplete 用于指示 input 元素是否能够拥有一个默认值,这个默认值是由浏览器自动补全的。
  2. enctype 当 method 属性值为 post 时, enctype 是提交form给服务器的内容的 MIME 类型,可能的取值有三个,application/x-www-form-urlencoded: 如果属性未指定时的默认值。multipart/form-data: 这个值用于一个 type 属性设置为 "file" 的 <input> 元素。text/plain (HTML5)。
  3. method 浏览器使用这种 HTTP 方式来提交 form。 可能的值有get和post。
  4. target 一个名字或者说关键字,用来指示在提交表单之后,在哪里显示收到的回复.

2.常见的Input标签主要由type属性控制。
type: 控件类型的显示。如果这个属性没有指定,默认的类型是 text。
type可用的值包括:

  • button:无缺省行为按钮。
  • checkbox: 复选框。必须使用 value 属性定义此控件被提交时的值。使用 checked 属性指示控件是否被选择。也可以使用 indeterminate 指示复选框在一种不确定状态(大多数平台上,显示为一条穿过复选框的水平线)。
  • file:此控件可以让用户选择文件。使用 accept 属性可以定义控件可以选择的文件类型。
  • hidden:不显示在页面上的控件,但它的值会被提交到服务器。
  • image:图片提交按钮。必须使用 src 属性定义图片的来源及使用 alt 定义替代文本。还可以使用 height 和 width 属性以像素为单位定义图片的大小。
  • password:一个值被遮盖的单行文本字段。使用 maxlength 指定可以输入的值的最大长度 。
  • radio:单选按钮。必须使用 value 属性定义此控件被提交时的值。使用checked 必须指示控件是否缺省被选择。在同一个”单选按钮组“中,所有单选按钮的 name 属性使用同一个值; 一个单选按钮组中是,同一时间只有一个单选按钮可以被选择。
  • range:HTML5 用于输入不精确值控件。
  • reset:用于将表单所内容设置为缺省值的按钮。
  • search:HTML5用于输入搜索字符串的单行文本字段。换行会被从输入的值中自动移除。
  • submit:用于提交表单的按钮。
  • color:HTML5 用于指定颜色的控件。
  • date:HTML5 用于输入日期的控件(年,月,日,不包括时间)。
  • datetime:HTML5 基于 UTC 时区的日期时间输入控件(时,分,秒及几分之一秒)。
  • datetime-local:HTML5 用于输入日期时间控件,不包含时区。
  • email:HTML5 用于编辑 e-mail 的字段。 合适的时候可以使用 :valid 和 :invalid CSS 伪类。
  • month:HTML5 用于输入年月的控件,不带时区。
  • number: HTML5 用于输入浮点数的控件。
  • tel:HTML5 用于输入电话号码的控件;换行会被自动从输入的值中移除A,,but no other syntax is enforced。可以使用属性,比如 pattern 和 maxlength 来约束控件输入的值。恰当的时候,可以应用 :valid 和 :invalid CSS 伪类。
  • text:单行字段;换行会将自动从输入的值中移除。
  • time:HTML5 用于输入不含时区的时间控件。
  • url:HTML5 用于编辑URL的字段。 The user may enter a blank or invalid address. 换行会被自动从输入值中移队。可以使用如:pattern 和 maxlength 样的属性来约束输入的值。 恰当的时候使可以应用 :valid 和 :invalid CSS 伪类。
  • week:HTML5 用于输入一个由星期-年组成的日期,日期不包括时区。

在input里,name 有什么作用?

由于表单提交的数据一般都是以key:value的方式提交,所以input中的name属性主要用来标识提交的数据的key值,好让服务器处理程序分辨。
例如:

<input name=name value=adam>
<input name=age value=18>

则服务器在后台收到的数据格式可能是这样的:

{
name:adam,
age:18
}

placeholder 属性有什么作用?

placeholder属性一般会在输入框有一个提示,该提示会在输入字段为空时显示,并会在字段获得焦点时消失。

注意:

  • placeholder 属性适用于以下的 <input> 类型:text, search, url, telephone, email 以及 password。
  • placeholder为HTML5的新属性
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,686评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,668评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,160评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,736评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,847评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,043评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,129评论 3 410
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,872评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,318评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,645评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,777评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,470评论 4 333
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,126评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,861评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,095评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,589评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,687评论 2 351

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,858评论 25 707
  • form简介 是HTML中的一个元素,它表示文档中的一个区域,这个区域包含了交互控件,用于向web服务器提交信息。...
    七里之境阅读 1,323评论 0 1
  • 文/爱吃香蕉的林默 01 我叫王清华,一个高三学子。 还有一个月我就解脱了。 今早和往常一样,我来到班级自习,睡眼...
    尤林默阅读 562评论 14 6
  • 无事常逛公众号诗同仁 去年光棍节微信加了主编仲诗文 今日购诗选才说话应允了题词签名 诗同仁公众号:zkshige ...
    微风LG阅读 342评论 0 3
  • 一 伍月在十九岁那年的冬天随歌舞团来到东北慰问演出。从小在南方长大的她人生第一次领略了零下二十度的刺骨之寒,也人生...
    独居女神京阅读 547评论 0 4