HTML中From表单的常用type属性及用法【较全】

最新推荐文章于 2024-09-01 17:11:25 发布
最新推荐文章于 2024-09-01 17:11:25 发布
阅读量3.9k 收藏 22
点赞数 2
文章标签： html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/NeiHan2020/article/details/115312454
版权
本文详细介绍了HTML中Form表单的各种type属性及其用途，包括文本框、密码框、单选按钮、复选框、列表框、按钮、文本域、文件域、验证功能等，并给出了相关示例代码。
摘要由CSDN通过智能技术生成

目录

 

1.文本框

2.密码框

3.单选按钮   checked

4.复选框   checked

5.列表框   selected

6.按钮

7.文本域

8.文件域

9.自带验证功能 邮箱  网址  数字

10.滑块  

11.search搜索框

12.隐藏域

13.只读与禁用

14.标注

15.验证

1.文本框


姓名:<input type="text" name="userName"  maxlength="6"/>

2.密码框


密码:<input type="password" name="mima" maxlength="6"/>

3.单选按钮   checked


男<input type="radio" name="sex" value="男"/>
女<input type="radio" name="sex" value="女"/>
 一组name值相同，必须指定value值     name=value(sex=男)
 


4.复选框   checked


<p>
    <input type="checkbox" name="hobby" value="music"/>音乐
    <input type="checkbox" name="hobby" value="game"/>游戏
     <input type="checkbox" name="hobby" value="swim"/>游泳
</p>
  name=value  一组name值相同，必须指定value值

 

5.列表框   selected


 <select name="month&#

最低0.47元/天 解锁文章
吾欲乘风归去，又恐琼楼玉宇
关注
JavaScript获取网页表单action属性的方法
10-24
JavaScript获取网页表单的action属性是一种常用的操作，通常用于获取表单提交时要发送到的URL地址。在Web开发中，表单是用来收集用户输入数据并将其发送到服务器的HTML元素。action属性指定了表单提交后，服务器处理...
html表单的type属性
ailw92114的博客
04-04 716
input type属性 Input表示Form表单中的一种输入对象，其又随Type类型的不同而分文本输入框，密码输入框，单选/复选框，提交/重置按钮等， 下面一一介绍。 type=text 输入类型是text，这是我们见的最多也是使用最多的，比如登陆输入用户名，注册输入电话号码，电子邮件，家庭住址等等。当然这也是Inp...
HTML里的form表单元素总结
qq_52016943的博客
05-25 1万+
1.<form>元素 HTML中用于创建表单的标签是<form>,表单以<from>开头，以</from>结尾. 2.<form>元素的基本属性 <from>元素通常是用来采集用户输入信息的表单控件，也可以包含其他元素，如段落、标题等。但是，不能包含另一个<from>元素，即<from>元素不能嵌套。 补充：method属性--------method属...
HTML表单中input标签中的type属性使用
最新发布
m0_62859066的博客
09-01 1411
单选中每一个表单控件必须设置value值，如果不设置，显示on,表示选择了某个选项，但是不知道具体选中的内容(在url地址栏上显示)多选中每一个表单控件必须设置value值，如果不设置，显示on,表示选择了某个选项，但是不知道具体先中的内容(跟单选相似)二,text,password,email,url,number,color,file,seach,submit,reset等。一，radio,checkbox,date,time,datetime-local,month,week等。
html:form表单的常用标签以及属性和html5新增的form的type属性值以及属性
YangLu888
10-02 8264
html表单form的常用标签以及属性和html5的新增属性
html—from表单详解
weixin_61496321的博客
10-28 1411
所有的用户输入内容的地方都用表单来写，如登录注册、搜索框。 一个表单一般应该包含用户填写信息的输入框,提交按钮等，这些输入框,按钮叫做控件,表单很像容器,它能够容纳各种各样的控件。
HTML:from表单的属性和常用组合标签
weixin_74100422的博客
03-29 3200
表单是在页面中可以让用户填写信息，用来收集用户信息，上传服务器，达到与用户交互的行为。在一个页面可以出现多个form表单，但不允许在一个form表单里面出现另一个form表单。
HTML学习笔记-表单项标签type属性值
qq_44653420的博客
12-04 4297
表单项标签type属性值 text 普通文本框 password 密码框 email 邮箱框，简单验证 radio 单选框 选项必须有相同的Name属性值，value属性设置实际提交的值。checked属性代表默认选中 checkbox 复选框，选项必须有相同的name属性值，value属性设置实际提交的值，checked属性代表默认选中 date 日期框 time 时间框 datetime-local 时间日
html form表单input使用disabled后提交不能获取表单值的解决方法
12-13
form表单输入框input设置disable属性提交后，得不到该输入框的值，解决该类问题可以参考下面两个方法： 方法一： 使用readonly带替代disabled，即把 disabled="disabled" 修改为 readonly="readonly" 二者区别： ...
PHP用正则匹配form表单中所有元素的类型和属性值实例代码
12-19
本篇文章将介绍如何使用正则表达式匹配`form`表单中的所有元素类型及其属性值，这对于网页抓取或数据分析非常有用。 首先，我们需要理解HTML表单的基本结构。一个典型的HTML`form`元素包括各种输入元素如`input`、`...
from 表单提交返回值用post或者是get方法实现
09-05
在这个过程中，`jQuery` 提供了 `$.post` 和 `$.get` 两种方法来实现异步的 AJAX 表单提交，从而实现在不刷新整个页面的情况下获取服务器的返回值。 `$.post` 是 jQuery 中的一个 AJAX 函数，它使用 HTTP POST 请求...
HTML中简单的form元素及属性：
pumpkin_truck的博客
11-05 1476
HTML中简单的form元素及属性： 1、作用：form表单主要用于收集用户的信息，并将form元素中收集到的内容提交到服务器。 2、input元素中常见的属性： type属性：常见的输入框如下： 名称 用法 text 该类型为普通的单行文本输入框，比如需要姓名，用户名等文本内容时使用 password 该类型为密码框，且当输入内容的时候，该类型会自动隐藏，并会以*的形式出现。 radio 该类型为单选框，用于实现单选的功能，常用于性别，支付方式选其一的事件，配合label元素时
HTML5中表单新增的type属性和其他属性
12-05 3964
一、表单新增的type属性 1.文本：输入框内容为文本格式 用户名：<input type="text" name="userName"> 2.密码：输入框内容为密码格式 用户名：<input type="password" name="password"> 3.邮箱：提交时会提示验证 邮箱：<input type="email" name="email">...
浏览器行为：Form表单提交
愿世界和平
07-04 7426
浏览器行为：Form表单提交 1、form表单常用属性 ?1234action：url 地址，服务器接收表单数据的地址method：提交服务器的http方法，一般为post和getname：最好好吃name属性的唯一性enctype: 表单数据提交时使用的编码类型，默认使用"pplication/x-www-form-urlencoded"，如果是使用POST请求，则请求头中的content-t...
input元素所有type类型及相关作用
越努力，越幸运！
11-16 3万+
随着HTML5的出现，input表单元素新增了多种输入控件，用以接受各种类型 的用户输入。其中text、password、radio、checkbox、button、submit、reset、image、hidden、file这10个是传统的输入控件，HTML新增的输入控件包括url、tel、search、email、color、number、range、month、week、date、time、...
常用限制input的方法
weixin_33806914的博客
04-12 241
常用限制input的方法1.取消按钮按下时的虚线框,在input里添加属性值 hideFocus 或者 HideFocus=true<input type="submit" value="提交" hidefocus="true" />2.只读文本框内容,在input里添加属性值 readonly<input type="text" readonly /...
HTML标签的type属性
66
03-30 2800
被input的type的imge属性迷惑啦上W3SCHOOL查查原来这样子的^-^ 根据不同的 type 属性值，输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等属性值:值描述button 定义可点击按钮（多数情况下，用于通过 JavaScript 启动脚本）。checkbox 
input标签的type属性汇总
热门推荐
夏天的博客
04-20 9万+
1.单行输入框< input type=“text”/> 单行文本输入框常用来输入简短的信息，如用户名、账号等，常用的属性有name、value、 maxlength。 2.密码输入框< input type=" password"/> 密码输入框用来输入密码，其内容将以圆点的形式显示。 3.单选按钮< input type=" radio"/> 单选按钮用于单项选择，如选择性别、是否操作等。需要注意的是，在定义单选按钮时，必须为同一组中的选项指定相同的name值，这样“
怎么在html中的from表单中添加http请求头Range
06-03
在 HTML 表单中添加 HTTP 请求头 Range 需要使用 JavaScript 来实现。具体步骤如下： 1. 首先，在 HTML 表单中添加一个隐藏的 input 元素，用于存储 Range 请求头的值： ``` <input type="hidden" id="range" name="Range" value=""> ``` 2. 在 JavaScript 中获取表单元素并设置 Range 请求头的值： ``` var rangeInput = document.getElementById("range"); rangeInput.value = "bytes=0-999"; // 设置 Range 请求头的值 ``` 3. 在提交表单之前，将 Range 请求头的值添加到 HTTP 请求头中： ``` var form = document.getElementById("form"); form.addEventListener("submit", function(event) { var xhr = new XMLHttpRequest(); xhr.open(form.method, form.action); xhr.setRequestHeader("Range", rangeInput.value); // 添加 Range 请求头 xhr.send(new FormData(form)); event.preventDefault(); }); ``` 以上代码中，form 是表单元素，xhr 是 XMLHttpRequest 对象，FormData 是用于构造 HTTP 请求体的对象。通过设置 XMLHttpRequest 对象的 setRequestHeader 方法，可以将 Range 请求头添加到 HTTP 请求头中。 注意：由于浏览器的安全限制，Range 请求头只能在部分情况下生效，具体取决于服务器是否支持该功能。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

吾欲乘风归去，又恐琼楼玉宇

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值