作者:老翅几回寒_332 | 来源:互联网 | 2023-08-11 13:54
1.初始表单post和get提交
表单元素格式
属性 |
说明 |
---|
type |
指定元素的类型。text、password、checkbox、radio、submit、reset、file、hidden、image、button,默认text |
name |
指定表单元素的名称 |
value |
元素的初始值。type为radio时必须指定一个值 |
size |
指定表单元素的初始宽度。但type为text或password时,表单元素的大小以字符为单位。对于其他类型,宽度以像素为单位。 |
maxlength |
type为text或password时,输入的最大字符数 |
checked |
type为radio或checkbox时,指定按钮是否被选中 |
2.表单的内容
按钮、多选框、文本框、单选框、列表框文本域、文件域、搜索框滑块、简单验证
3.表单的应用
表单的应用
- 隐藏域:hidden
- 只读:readonly
- 禁用:disabled
4.表单初级验证
表单初级验证
- 常用方式
- placeholder:提示信息
- required:非空判断
- pattern:正则表达式
DOCTYPE html>
<html lang=""en"">
<head>
<meta charset=""UTF-8"">
<title>表单title>
head>
<body>
<h1>注册h1>
<form action=""1.初始网页.html"" method=""get"">
<p> 名字: <input type=""text"" name=""username"" placeholder=""请输入用户名"" required> p>
<p> 密码: <input type=""password"" name=""password"" placeholder=""请输入密码"">p>
<p>性别:
<input type=""radio"" value=""boy"" name=""sex""/>男
<input type=""radio"" value=""girl"" name=""sex"">女
p>
<p>爱好:
<input type=""checkbox"" value=""sleep"" name=""hobby"">睡觉
<input type=""checkbox"" value=""code"" name=""hobby"">敲代码
<input type=""checkbox"" value=""chat"" name=""hobby"">聊天
<input type=""checkbox"" value=""game"" name=""hobby"">游戏
p>
<p>按钮:
<input type=""button"" name=""btn1"" value=""点击"">
p>
<p>下拉框:
<select name=""列表名称"">
<option value=""china"">中国option>
<option value=""us"">美国option>
<option value=""se"">瑞士option>
<option value=""uk"">英国option>
select>
p>
<p>反馈:
<textarea name=""textarea"" cols=""30"" rows=""10"">文本内容textarea>
p>
<p>上传文件:
<input type=""file"" name=""files"">
p>
<p>邮件验证:
<input type=""email""name=""email"">
p>
<p>URL:
<input type=""url"" name=""URL"">
p>
<p>数字:
<input type=""number"" name=""number"" max=""100"" min=""0"" step=""1"">
p>
<p>滑块:
<input type=""range"" name=""voice"" min=""0"" max=""100"" step=""1"">
p>
<p>
<input type=""search"" name=""search"">
p>
<p>
<label for=""mark"">你点我试试label>
<input type=""text"" id=""mark"">
p>
<p>
<input type=""submit"">
<input type=""reset"" value=""清空表单"">
p>
form>
body>
html>