它的语法是这样的
目录
1 无自带验证机制
我们每个都看一下
它显示出来是这样的
1.1 text
我们一个一个讲，先说text,我们可以在text中输入任意字符
关于text有三个属性是它可以用的
- name 这个文本框的名字，这个是给开发者看的，后续css可以配合这个名字
- value 文本框的默认值
- maxlength 文本框中文本最大长度
我们现在设置一下
现在它打开就是这个样子的
我们现在想要再输入一个值
发现输入不进去了
1.2 password
会以明文的形式显示，如果我们想要让其密文显示，那么我们应该用password
password可用属性与text相同
- name 这个文本框的名字，这个是给开发者看的，后续css可以配合这个名字
- value 文本框的默认值
- maxlength 文本框中文本最大长度
我就不展示了
1.3 radio
radio通常用于单选的按钮，我们下面做个例子
现在我们想选是可以都选上的
radio点上了默认情况下再点一次是无法取消选择的
radio的属性有
- name 单选框的名字
- checked 如果checked的值为checked则会默认选中
- value 单选框的值，这个属性在前端没有影响，是用户点了之后返给后台的东西
只有radio的name相同它才能每次只选一个，我们用一下看看
它打开之后是这样的
如果我选中另一个，它会自动否掉前面的选择
1.4 checkbox
checkbox一般用于多选按钮，我们做个例子
默认情况下我们是可以给它都选上的
它能用的属性是checked，name，value，checked 如果设置了就会自动被选中，name和value我们就不写了，我们测一下checked
它打开之后就是这样的
1.5 submit
submit是这样的，你点一下提交，相关信息就能发送到你form填写的路由中
submit可用属性是name与value，name起名字我们不测了，value可以改按钮中的文字，我们简单做一下
现在打开它就变成这样了
我们现在路由是随便给的，现在你点一下它就返回404了
1.6 reset
reset是重置按钮，如果点了这个表单中所有数据都会恢复默认状态，它可用的属性是name与value，value能改按钮上的字，我们测一下
现在它就变成这个样子了
1.7 button
一个普通的按钮，一般搭配js使用，可用属性为name与value，value可以写上面的文字
1.8 file
这个是上传文件的，我现在随便选一个文件看看
我选了一个python.png的文件，它就会把文件名写在后面
同一个file按钮我们只能选择一个文件上传，如果再上传一个就会覆盖掉前一个
可用属性为name与value，给value属性并不会更改前端的显示，后端会根据value值做响应的处理
1.9 hidden与image
用到再提
2 有自带验证机制
下面的表单类型有各种各样的验证机制，如果要使用这些验证机制，我们需要将input放在表单域form中
- 这些都是html5中才有的标签，目前兼容性可以稍差些
我们依次看一下
2.1 邮箱 email
我输入1之后按下回车
如果只有@，它也会提示
但是这样是可以提交上去的
总的来说不是很严谨，所以我们如果限制用户的提交内容，还是应该自己写一个判定判断一下
2.2 网址 url
2.3 日期 date
右侧的小图标点一下还能选日子
2.4 时间 time
右边的图标点可以可以选时间
2.5 月 month
2.6 周 week
2.7 整数 number
右侧两个图标可控制加减
不能输入小数
汉字直接就输入不进来，负数是可以的
2.8 手机号码 tel
这个在电脑上是没有用的
在手机上打开默认会给小键盘页面，但你依然可以输入除了除数字以外的内容
2.9 搜索框 search
当你想重新输入时，点击右侧的叉就可以清空文本框了
2.10 颜色 color
点击后可以选择颜色
279
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
