input标签用法解读

最新推荐文章于 2024-04-30 17:59:49 发布
最新推荐文章于 2024-04-30 17:59:49 发布
阅读量519 收藏 1
点赞数
分类专栏： vue前端 文章标签： html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/likunpeng6656201/article/details/99704908
版权
本文介绍了HTML和HTML5中input标签的用法，包括text、button、submit、password、checkbox、radio、file、reset等常见类型，以及HTML5新增的date、number、range和search类型。通过实例展示了各种类型的input标签在网页中的应用和效果。
摘要由CSDN通过智能技术生成

HTML5/HTML中标签用法解读
OK！今天博主为小伙伴们介绍的内容是HTML5/HTML中标签的用法，，， ，emmm图文并茂哦！
下面正式开始内容的介绍：首先，直观上说标签规定了用户可以在其中输入数据的输入字段！元素在元素之中使用的时候，用来声明允许用户输入数据的input控件：输入字段可以通过多种方式改变，取决于type的值。

首先是HTML5之前的HTML中input标签：这个时候type的属性一般有以下几个：

    text button submit password checkbox radio file reset

下面来详细解说：
（1）text：先来看下运行效果；在这里插入图片描述

test这个属性没什么好说的，，就是圈一个文本框，我们可以在其中输入文本；

（2）button：就像他的名字一样，是一个按钮！我们可以为他赋予value值；
在这里插入图片描述
运行效果还有代码如上！按钮用的超级多啊，一般与一些动作函数一起使用！比如onclick onmouseover onmouseout等，这里不说这个，，感兴趣的小伙伴可以自行了解！

（3）submit：submit与button有点像，，不同的就是submit天生就可以点击，可跳转到另外一个页面，而button则需要onclick这个方法来激活！比如，我们时常会遇到酱紫的情况，，网申一份简历的时候，在最后往往都有一个提交的按钮！下面我们使用submit来实现跳转到百度首页！
在这里插入图片描述
在这里插入图片描述
这里呢，我们点击一下提交，，，几秒后就可以跳转到百度首页了！实现代码如下：
最低0.47元/天 解锁文章
日G一卒
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
1-4、React中form表单下的input框初使用以及列表渲染
01-20
【标题】: "1-4、React中form表单下的input框初使用以及列表渲染" 【描述】: "本文档是React系列教程的一部分，涵盖了React环境的搭建、JSX语法、属性绑定、事件处理等内容。文章通过一个小项目，展示了如何在React...
解读html5关于html5的应用与认识
12-25
• 不需要闭合标签 在 HTML5 中，空标签（如：br、img 和 input ）并不需要闭合标签。 • 废弃的标签 下面这些标签并不被 HTML5 支持： <acronym>、<applet>、<basefont>、<big>、<...
input标签使用
qq_41398448的博客
09-25 213
&lt;!doctype html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;input 标签的使用&lt;/title&gt; &lt;style&gt; .but{ width:50px; height: 30px; cursor: pointer
<input>标签常见用法
qq_25178609的博客
03-17 2056
<input>标签定义和常见用法 标签用于搜集用户信息。根据不同的 type 属性值，输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
HTML中input输入框（详解输入框的用法）
最新发布
百赢出品，必属精品
04-30 1万+
input>元素是HTML表单中最常见的元素之一，用于收集用户的输入数据。它可以包含多种类型的输入，如文本、密码、数字等。通过指定不同的type属性，可以定义不同类型的输入字段。类型（type）属性定义输入字段的类型，如文本框、密码框、单选按钮、复选框等。常见类型包括textpasswordradiocheckboxfile等。名称（name）属性用于标识输入字段的名称，以便在表单提交时能够将数据传输到服务器。对于单选按钮和复选框，相同名称的一组按钮被视为一个组，只能选择其中的一个或多个。
HTML中input标签使用法汇总
m0_67846661的博客
05-19 1万+
HTML input标签的属性： 1.type：该属性是input标签里唯一的必须输入的属性，当然，也可以不填，默认为type = “text”。具体它有那些值，我们后面再讨论。 2.required：标记一个字段是否为必须。如果一个字段被标记为required = “required”（严格模式下），或者required（宽松模式下）(ps：下面属性的写法同理，就不一一写出了)，并且这个字段的值为空，或者填入的值是无效值，那么这个表单不能提交。什么是无效值？看pattern属性。 3.pattern
input标签的使用
Q_004的博客
08-12 319
1,仅输入数字,禁止输入负号等符号. <input id='scoreinput' type="tel" value='' placeholder='请输入整数' onChange={e=>{ var val=e.target.value; var reg=/[^\d]/g; val = val.slice(...
Input 标签使用和属性
LHB的博客
09-10 1339
1.文字键盘 您的标准文本输入域代码将是这个样子：<input type="text">2.电话键盘 为了显示电话键盘，使用：<input type="tel">3.URL键盘 对于网址 代码如下：<input type="url"> 4.电子邮件键盘 对于电子邮件地址，代码如下：<input type="email">5.数字键盘 最后，对于一个简单的数字键盘（类似于电话之一，但不带+，
5G_LTE_Pathloss_Input_v13.0
03-27
6. **文档**：可能包括用户手册、技术规格书或研究论文，解释模型的工作原理、使用方法以及如何解读结果。 7. **更新日志**：记录了v13.0相对于之前版本的改进和新特性。 5G和LTE网络的路径损耗评估对于网络规划至...
eskk.vim：eskk是输入法引擎SKK的纯Vim脚本实现。
02-02
**标签解读：** 1. **vim** - 表明这个话题与Vim编辑器有关，Vim是一个高度可配置的文本编辑器，广泛应用于代码编辑。 2. **skk** - 这是SKK输入法的缩写，一种在日本常用的ASCII输入法系统。 3. **input-method** ...
解读ASP.NET 5 & MVC6系列教程（13）：TagHelper
10-22
在使用TagHelper时，我们不再需要编写服务器端的辅助方法，而是直接在HTML标签上添加特定的属性。例如，以前创建一个带有验证的全名输入框可能需要以下代码： ```html @Html.LabelFor(model => model.FullName) @...
HTML-＜input＞标签的基本使用
qq_35389653的博客
12-21 355
输入标签
Input的多种用法
热门推荐
weixin_44556271的博客
01-20 1万+
1、 定义和用法 标签用于搜集用户信息。 根据不同的 type 属性值，输入字段拥有很多种形式，和不同的表达方法（来自w3c） 比如： ,文本框 ,密码框 ,提交按扭 ,复选框,单选框 ,隐藏域 ,按扭 ,浏览...
HTML input 标签 详细 方法 描述
生活中的思索
08-02 1493
addbehavior :给元素附加一个行为。 appendchild :给对象追加一个子元素。   applyelement :使得元素成为其它元素的子元素或父元素。 attachevent :将指定函数绑定到事件，以便每当该事件在对象上触发时都调用该函数。   blur :使元素失去焦点并触发 onblur 事件。   clearattributes :从对象中删除全部标签属
常用限制input标签的方法
幸福的猪的专栏
11-02 617
1.取消按钮按下时的虚线框,在input里添加属性值 hideFocus 或者 HideFocus=true 2.只读文本框内容,在input里添加属性值 readonly 3.防止退后清空的TEXT文档(可把style内容做做为类引用) 4.ENTER键可以让光标移到下一个输入框 5.只能为中文(有闪动) 6.只能为数字(有闪动) 7.
【HTML 教程系列第 22 篇】 HTML 中的 input 标签，看这一篇就够了
“Allen Su”的博客
11-02 1万+
一：什么是 HTML 中的 input 标签 。 二：input 标签 type 的取值 text、password、radio、checkbox、file、button、submit、reset。 三：如何为单选框，复选框设置默认选项。 四：使用单选框的两个注意事项。
html 的input标签 各种输入控制
性感的杏鲍菇的专栏
12-06 5958
1.只能输入和粘贴汉字 <input onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))"><br/> 3.只能输入和粘贴数字 <i
有关input标签做了一些总结
懒散的蜗牛
08-24 375
1、返回历史上一页 onclick="window.history.go(-1)" 2、重置按钮 onclick="javascript:window.history.back();" 3、输入框字数限制 &lt;input type="text" id="name" maxlength="20" placeholder="最大长度为20"/&gt; $(d
html input 数值计算,JS操作input标签内数值计算
weixin_39850331的博客
06-29 579
这次给大家带来，的注意事项有哪些，下面就是实战案例，一起来看一下。window.onload=function(){var oIput1=document.getElementById('put1');var oIput2=document.getElementById('put2');var nAdd=document.getElementById('add');var nSub=documen...
HTML介绍完美版资料.ppt
11-16
它包含了关于HTML的基本概念、标签的使用方法、HTML5的特点和新特性等内容。通过解读这份资料，读者可以全面了解HTML的基础知识和HTML5的发展趋势。 HTML5的特点: HTML5是HTML的最新版本，相比之前的版本，它具有...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值