form提交数据表单 学习笔记

form标签的属性

<form method = 'get|post' //决定数据提交的方式 （get 或 post） action = '' // 接受数据的地址 > </form>

form标签的组件

1. input

<input type = 'text|password|submit|radio|checkbox|number' //决定输入框的种类 文本|密码|按钮|单选框|复选框|数字(定义单选\复选框时要定义name，不然可能无法实现单选功能) checked = 'checked'//单选框默认选中 value = '' //决定提交的值，由用户选择或输入，当type为submit时，value为submit中的值 name = '' //提交的数据的名称 maxlength = '' //数据的最大长度 readonly = 'readonly' //input框不可聚焦（不可用），可以自定义value值。使用此属性后，value中的数据可以提交 disabled = 'disabled' //禁用此input框，背景颜色会有改变，可以自定义value值，使用此属性后不可提交数据 form = 'form id' //html5新属性，定义后input属于表单之外时也可以提交数据 > //password中的value可以在js中获取 提交数据时，text与password框中要有name属性，之后再通过submit按钮提交value中的数据（数据格式name = value）

CSS input伪类选择器

input：focus{ } //当input被聚焦时的样式

2.label

<label for = '' //label标签中的for属性可以与input中的id绑定，使其点击label时自动聚焦input框 //绑定方法:for的名称等于id名称>

3.select,option

select标签表示下拉框，option则为选项，option没定义value值时，值为标签内的内容。option无法定义事件

4.textarea

多行文本输入框

<textarea cols = '' //可见宽度，只用输入数字，不用px rows = '' //可见行数，只用输入数字，不用px >此处文本不可有换行和空格，浏览器会解析其为字符</textarea>

5.fieldset，legend

fieldset是一个表单样式标签，可以自定义，legend为标题

<fieldset style = 'width:300px'> <legend>用户登录</legend> <form action=""></form> 用户名： <input type="text" /> <br/> 密码： <input type="text" /> <br /> <button type="submit">提交 </button> </fieldset>

样式如下：

MD5信息摘要算法

用于用户信息的加密

不可逆的加密算法一旦加密不可解密不需要加密密匙