HTML表单简单用法

form表单

form表单用于收集用户的输入,并将收集到的输入组成Key:Value的形式发送到服务端

form

action定义提交表单的地址,method,定义提交表单的方法,有post和get两种

<form action="/url" method="get">
    <botton>提交</botton>
</form>

input

  • name属性规定了input元素的名称,用于对提交到服务器后的表单数据进行标识,只有设置了name属性的表单元素才能在提交表单时传递它们的值

<input type="text" name="" placeholder="">
定义用户可输入的单行输入字段,placeholder的值是用以描述文字在输入框中预提示用户,该提示会在用户输入时消失

<input type="password" name="" value="">
定义密码字段,在此输入框中输入的数据会显示为星号或者圆点,value的值会预先显示在输入框中

<input type="hidden" name="" value="">
定义隐藏字段

<input type="file" accept="image/png">
定义上传文件,文件类型为PNG格式

<input type="radio" name="" value="">
定义单选按钮,不同的name值视为不同的单选组

<input type="checkbox" name="" value="">
定义多选按钮

<input type="sumbit" name="sumbit">
定义提交按钮,提交按钮可以向服务器发送表单数据。

<input type="button" name="button">
定义可点击按钮,但是没有任何行为,常用于在点击按钮是启动JavaScript程序

<input type="reset" name="reset">
定义重置按钮,用于清空当前的输入

select

    <select>
     <option name="MyCar" value="BWM">宝马</option> 
       <option name="MyCar" value="AUDI">奥迪</option>
     <option name="MyCar" value="saab" selected>萨博</option>         
    </select>

定义下拉菜单

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 表单是Web页面上负责用户输入与服务器端数据交互的最基础方式,这里我们针对最基本的表单内容显示,来看一下HTML的...
    我是一只_鱼阅读 300评论 0 0
  • HTML表单 在HTML中,表单是 ... 之间元素的集合,它们允许访问者输入文本、选择选项、操作对象等等,然后将...
    兰山小亭阅读 3,439评论 2 14
  • 表单基础知识 在HTML中,表单是由 元素来表示的,而在JS中,表单对应的则是HTMLFormElement类型。...
    oWSQo阅读 920评论 0 1
  • 1.动手 form 表单table 表格 2. <form>表单元素 1) 简述: 元素是块级元素,其开始标签和结...
    _Dot912阅读 2,047评论 2 8
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,914评论 18 139