HTML:表单form_html对数字自动校验-优快云博客

本文详细介绍了HTML表单的基础结构，包括<form>标签的action属性、各种<input>类型如文本、数字、邮箱和密码的使用，以及submit按钮的作用。同时涵盖了select和radio元素的选择和常用属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

form：文档区域，此区域包含交互控件，用于向 Web 服务器提交信息。

<body>
    <form action=""></form>
</body>

action:可以传入地址，也可删除

当传入网址的时候一点submit的button就会跳转到该网址

<body>
    <form>
        <label for="username">用户名</label>
        <input type="text" name="iddd" id="username">
        <button type="submit">提交</button>
    </form>
</body>

<input>标签
HTML <input>用来填写内容，常见类型有：

<input type="text">：创建基础的单行文本框。

<input type="number">：用于让用户输入一个数字。其包括内置验证以拒绝非数字输入。浏览器可能会选择提供步进箭头，让用户可以使用鼠标增加和减少输入的值，或者只需用指尖敲击即可。

<input type="email">：带有 “email” (电子邮箱) 类型标记的输入框元素 (<input>) 能够让用户输入或编辑一个电子邮箱地址，此外，如果指定了multiple属性，用户还可以输入多个电子邮箱地址。在表单提交前，输入框会自动验证输入值是否是一个或多个合法的电子邮箱地址 (非空值且符合电子邮箱地址格式). CSS 伪标签 :valid 和 :invalid 能够在校验后自动应用。

<input type="password">：<input> 元素里有一种叫做 “password” 的值，给我们一个方法让用户更加安全的输入密码。这个元素是作为一行纯文本编辑器控件呈现的，其中文本被遮蔽以致于无法读取，通常通过用诸如星号（“*”）或点（“•”）等符号替换每个字符来实现。这个符号会根据用户的浏览器和操作系统来具体显示哪个。

<input type="radio">：<input> 的 radio 类型元素默认渲染为小型圆圈图表，填充即为激活，类似于之前描述额复选框（checkbox）类型。单选按钮允许你选择单一的值来提交表单。

name相同选一个，value是值，id是绑定lable

常用属性有：

name: 名称
id: 唯一ID
maxlength：最大长度
minlength：最小长度
required：是否必填
placeholder：当表单控件为空时，控件中显示的内容

textarea：评论区，可拉长评论框

 <label for="resunme">用户名</label>
        <textarea name="resume" id="resume" cols="30" rows="10"></textarea>

select：选项

option：选择(selected是默认；无value是空）

        <label for="lang">lang</label>
        <select name="lang" id="lang">
            <option value=""></option>
            <option selected value="cpp">cpp</option>
            <option value="cpp">java</option>
            <option value="cpp">python</option>
        </select>