HTML表单

        今天学习了HTML表单。表单元素包含input元素,复选框,单选按钮,下拉菜单等。下面将一次总结form标签及其标签属性、 input元素、列表框和下拉菜单、文本框。

        HTML表单用form标签定义,该标签常用属性包含action,enctype, method。action指定form表单提交数据的地址。enctype属性有三种不同的参数,默认为“application/a-www-form-urlencoded”,表示将表单控件中的值处理成url的编码方式;“mutipart/form-data”将表单中的值解析成二进制流,多用于文件传输时;“text/plain”用于在form的action属性值为“mailto:URL”时发送邮件。method用于指定表单数据提交给服务器时的方式,一般有post和get两种,其中post传输的数据量较大,而get会将需要传输的数据追加在url地址后面,也就是用户可以在网页地址栏直接看到表单传递的数据。

        form表单通常需要与其他控件配合使用。下面先总结一下最重要的表单元素input元素。用<input></input>标签定义该元素,它有多种形式,根据它的一个重要属性type的参数不同而不同。下面是type属性常用的属性值,具体含义可以直接字面意思看出,不做赘述。


type常用属性值

        虽然input元素可以指定其type为button定义按钮,但是局限性较大,还有更专业的button,那就是直接用button标签定义的按钮。列表框和下拉菜单都是用<select></select>标签定义。多行文本框由textarea标签定义,使用其readonly="readonly"属性可以将textarea定义为只读不可编辑的形式,如我们常见的注册账号时弹出的用户安全协议的形式。

        本次总结比较粗糙,下面还是贴一下各个元素的简单使用。(额,有没有切换编辑器,还是截图吧)


代码1
代码2
代码3

        对应的运行效果如下图:


表单效果




笑靥生花

More interest. Less interests. Just keep going and never give up!

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • HTML表单HTML表单用于搜集用户输入HTML表单常用属性及说明:属性描述accept-charset规定在被提...
    Lv_0阅读 560评论 0 1
  • 引言: 表单是我们在日常页面之中最多用来与用户交互数据的一种方式,其中有许许多多的标签带我们来开发,H5之中更是添...
    ArvinH阅读 3,250评论 0 0
  • <input>标签 标签用于搜集用户信息,根据不同的type属性值,输入字段拥有很多种形式。输入字段可以是文本字段...
    _空空阅读 4,159评论 0 3
  • 1 表单是如何工作的? 用户在网页上填写表单并提交所填信息,浏览器将用户提交的数据发送至 Web 服务器, Web...
    饥人谷_Mily阅读 1,254评论 0 1
  • 2018年1月23日 星期二 晴 今天下班回家,女儿说起她们几个女生一块玩游戏的过程,真是...
    周李扬阅读 222评论 0 0

友情链接更多精彩内容