笔记：HTML5中input元素新增的type值

在HTML5中,input元素的type值增加了不少,使input的功能强大了很多. 但在各大浏览器中并不是所有的type值都支持. 以下是比较有用.并且浏览器支持的稍好一些的值: type=color 颜色 type=date 日期(不包括时间) min:最小值 max:最大值 type=number 数字 min:最小值 max:最大值 step:改变数字时每一步的加减值 type=range 滑块 min:最小值 max:最大值 step:滑动时每一步的加减值 type=email 邮箱地…

HTML5中input[type='date']自定义样式

HTML5提供了日历控件功能,缩减了开发时间,但有时它的样式确实不如人意,我们可以根据下面的代码自行修改. 建议:复制下面的代码段,单独建立一个css文件,方便我们修改. /* 修改日历控件类型 */ ::-webkit-datetime-edit { padding: 1px;} /*控制编辑区域的*/ ::-webkit-datetime-edit-fields-wrapper { background-color: #fff; } /*控制年月日这个区域的*/ ::-webkit-date…

html5中input的type类型有哪些（总结）

html5中input的type类型有哪些(总结) 一.总结一句话总结:时间.颜色.(邮件.电话.url).(数字.数字范围).搜索search 二.html5中input的type类型值描述 button 定义可点击的按钮(大多与 JavaScript 使用来启动脚本) checkbox 定义复选框. color 定义拾色器. date 定义日期字段(带有 calendar 控件) datetime 定义日期字段(带有 calendar 和 time 控件) datetime-local…

HTML（七）HTML 表单(form元素介绍，input元素的常用type类型，input元素的常用属性)

前言表单是网页与用户的交互工具,由一个<form>元素作为容器构成,封装其他任何数量的表单控件,还有其他任何<body>元素里可用的标签表单能够包含<input>.<menus>.<textarea>.<fieldset>.<legend>.<label>等表单控件元素 [注意]表单里嵌套表单是不允许的 form元素 form元素有accept-charset.action.autocomplete.enc…

html5中output元素详解

html5中output元素详解一.总结一句话总结: output元素是HTML5新增的元素,用来设置不同数据的输出,没什么大用,了解即可 <form action="L3_01.html" method="get" oninput="num.value=parseInt(num1.value)+parseInt(num2.value)"> <input type="number" id="nu…

修改表单元素中placeholder属性样式、清除IE浏览器中input元素的清除图标和眼睛图标

一.修改input元素placeholder属性样式在做项目的时候,一般表单元素的placeholder属性样式都是使用浏览器默认的,但有时候为了追求设计上的美感需要修表单元素的placeholder样式(也有可能是遇到了一个处女座的设计师或者是客户),就不等不修改一下placeholder的样式.可以通过下面的代码修改样式: /*Chrome.Safari等 webkit内核浏览器*/ ::-webkit-input-placeholder{ color:red; } /*Firefox*/…

html5中time元素详解

html5中time元素详解一.总结一句话总结: time的使用的话主要是将时间放在datetime属性里面:<time datetime="2015-10-22">文章发表于2015年10月22日</time> time作用主要是为了方便浏览器对时间数据的提取 1.HTML5中的 time元素微格式是什么? HTML5中的微格式,是一种利用HTML5中的新标签(比如time标签)对网页添加附加信息的方法,附加信息例如新闻事件发生的日期和时间,文章发表的…

html5中section元素详解

html5中section元素详解一.总结一句话总结: section元素用来定义文章中的章节(通常应该有标题和段落内容) section元素的作用就是给内容分段,给页面分区 1.section元素和 div元素的区别是什么? div强调在形式上的独立性,section强调的是内容上的独立性,注意它的语义. section可以看做 <div id="section"></div> 2.article元素和section元素的区别是什么? article元…

Html5中input新增的表单元素和属性介绍。

input标签主要用于Web表单的创建交互,以便接受来自用户的数据. 我们通过更改type属性的值,来实现不同的输入类型.在以前的写法中表单元素必须放在form元素所包含的里面,而在html5中,我们可以把它们写在页面上的任何一个地方,只需要给该元素增加一个form属性,form属性的值为form表单的id.例如: <form method="get" id="test"> <input type="text" name=&qu…

html5中input新增type值的使用

二狗在最近的项目以html5和webapp为主,并接触到了input新增type值的使用,下面就把这些玩意一一以实例列举出来一:type = date:定义日期:年-月-日 input type="date"可以获取年月日的值,也可以给它的value设置自定义的值哦. 注意:如果你想给input设置你自定义的value值,自定义的值的格式一定要和input type=date的格式一样才行. <!doctype html> <html> <head&…

[html5] 学习笔记-改良的input元素种类

在html5中,大幅度增加与改良了input元素的种类,可以简单的使用这些元素来实现之前需要JS脚本来实现的功能. 1.url类型.email类型.date类型.time类型.datetime类型.datatime-local类型.month类型.week类型.number类型.range类型.search类型.Tel类型.color类型 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Ty…

html5中 input的pattern属性和 details/summary元素

html5--3.21 课程小结与其他新增元素一.总结一句话总结: input的pattern属性可以设置正则验证,比如检测学号的位数和数字区间 details/summary元素配合起来可以做元素折叠的效果,summary为detail设置标题请输入你的学号:<input type="text" name="name" pattern="[0-9]{4}"> 1.details/summary元素实例? details/sum…

HTML5中form的新增属性或元素

1.新增的表单元素 1.1 progress表示任务的完成情况,常用于进度条. max 定义进度元素所要求的任务的工作量,默认值为1 value 定义已经完成的工作量,如果max值为1,该值必须是介于0~1之间的小数. <progress value="70",max="100">70%</progress> 1.2 output表示用户动作产生的结果. name 定义元素的名称 for 其他元素的id列表,表明这些元素为计算提供了输入值(或…

HTML5中input标签有用的新属性

HTML5对input增加了一些新标签,个人觉得比较常用有效的以下几个 placeholder=“请输入” 常见用于默认提示 autofocus 自动聚焦到当前输入框 maxlength="18" minlength="3" 控制最少最多输入个数 autocomplete="off" 关闭浏览器自动记住历史输入内容,默认on 新增的type类型 type="search" 有些手机样式表现会有不同,比如圆角,有X按钮 type…

HTML5中dialog元素尝鲜

对话框(别称模态框,浮层)是web项目中用于用户交互的重要部分,我们最常见的就是js中 alert(),confirm(),但是这个对话框的不美观,也不能自定义样式,所以在开发的过程中,一般根据自己自己的需求造轮子或者使用第三方的. 对话框的组成常见的弹出框形式: 位置:屏幕的左上角,右上角,左下角,右下角,垂直居中等大小:定宽定高,定宽不定高,不定宽不定高等开发中的对话框形式就是位置和大小随机组合的一种情况. 但是有一种情况(不定宽高的垂直居中)不易实现(可以使用display:tabl…

HTML5中DOM元素的querySelector/querySelectorAll的工作机制

在HTML5中,提供了强大的DOM元素选择API querySelector/querySelectorAll,允许使用JavaScript代码来完成类似CSS选择器的DOM元素选择功能.通常情况下,我们都是使用的document.querySelector/querySelectorAll来选择DOM元素,但是有些时候会使用DOM元素上的querySelector/querySelectorAll方法,此时就有些怪异了. 比如说,下面的这样一个HTML页面(示例页面中为了方面说明问题,我为每个…

HTML中,input元素的 Disabled属性所产生的后端无法接收数据的问题

背景今天从前端提交 form表单数据时,发现设置 Disabled 的 input 元素的字段数据在后端无法接收到原因查阅资料(来自W3school): disabled 属性规定应该禁用 input 元素. 被禁用的 input 元素既不可用 ,也不可点击.可以设置 disabled 属性,直到满足某些其他的条件为止(比如选择了一个复选框等等).然后,就需要通过 JavaScript 来删除 disabled 值,将 input 元素的值切换为可用. 注释:disabled 属性无…

python之enumerate函数：获取列表中每个元素的索引和值

源码举例: def enumerate_fn(): ''' enumerate函数:获取每个元素的索引和值 :return:打印每个元素的索引和值 ''' list = ['] for index, value in enumerate(list): print("索引:" + str(index), ", 值:" + value) enumerate_fn() 运行结果: 索引:0 , 值:Mike 索引:1 , 值:male 索引:2 , 值:24…

HTML5中input新增类型+表单新增属性+其他标签属性

@ (猴头) Input 新增属性 email 邮箱(只在手机端有效) url 网址(只在iphone手机有效) tel 手机号(只在手机端有效) number 数字(右侧有上下按钮,只能输入数字,+号,-号,. 和e) input 日期时间(手机端效果比较好) date 年月日 time 小时和分 datetime 年月日+小时和分 (iphone和安卓都不再兼容,电脑端也不兼容) datetime-local 本地年月日+小时和分 month 年月 week 年和周 (iphone…

【HTML5】input元素type属性值

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <form > 用户名<input type=&q…

【HTML5】HTML5中video元素事件详解（实时监测当前播放时间）

html 代码..video后边几个元素,可处理ios 系统的兼容性 <video id="myVideo" controls="controls" poster='预览图' preload="auto" x5-playsinline="" playsinline="" webkit-playsinline="" > <source src="" t…

html input元素的所有type属性

<input /> 属性 type="text" 输入框的类型为文本 type="password" 输入框的类型为密码 type="radio" 输入框的类型为单选 type="checkbox" 输入框的类型为多选 type="file" 输入框的类型为上传文件 type="submit" 输入框的类型为提交页面 type="button" 输入框的类…

Firefox中input元素,不能重新获取焦点函数focus()

js校验输入框的函数: function is_number(feild) { var strRegExp = /^\d+(\.\d{1,2})?$/; if (!strRegExp.test(feild.value)) { alert("请输入有效的数字,小数点后最多只能输入两位!"); feild.focus(); return false; } } 元素获取焦点函数focus(),在IE中正常,Firefox中却不起作用. 解决方案: window.setTimeout(func…

用Scala实现集合中相邻元素间的差值

欢迎转载,转载请注明出处,徽沪一郎. 概要代码这东西,不写肯定不行,新学Scala不久,将实际遇到的一些问题记录下来,日后也好查找. 今天讲的是如何计算同一集合中元素两两之间的差值,即求开始集合(a,b,c,d)中(b-a,c-b,d-c) 解法 val l1 = 1 to 10 toList val l2 = l1.tail l1.zip(l2).map(p=>(p._2 - p._1) 上述代码即可求出两两差值.代码含义稍作解释: tail表示一个集合中除首元素外的剩余元素,也是一个集合.…

jsp中input获得后台传递的值

1.后台赋值 req.setAttribute("openId",openId); 2.前台获取值 value="<%= request.getAttribute("openId") %>" 用form表单,根据name属性将值传单后台…

html5中新增的form表单属性

html5中新增两个表单属性,分别autocomplete和novalidate属性 1.autocomplete属性该属性用于控制自动完成功能的开启和关闭.可以设置表单或者input元素,有两个属性值,当设置为on时,启动该功能:当设置off时,关闭该功能.启用该功能后,当用户在自动完成域开始输入时,浏览器就会在该域中显示填写的选项.用户每提交一次,就会增加一个用于选择的选项 <!DOCTYPE html> <html> <head lang="en"…

# 详细了解HTML5中的form表单

4.规范使用 <form>元素用于组织所有表单部件(也称为控件或字段),负责告诉浏览器把数据提交到哪里,方法是在action属性中提供一个URL.加入你只是想在客户端使用JavaScript操作表单,那么只要在action属性中指定一个井号(#)即可. ️注意:HTML5新增了一种机制,支持把表单控件放在它所在的表单外面.方法是使用心得form属性引用表单的ID值(如:form="zooForm").不过浏览器的支持情况并不完整. 使用<form>比较标准规范的…

html5中新增的非主体结构的元素

html5中出了新增了article.section.nav.aside.time主要结构元素外,还增加了一些表示逻辑结构或附加信息的非主体结构元素. 一.header元素 header元素是一种具有引导和导航作用的结构元素,通常用来放置整个页面或页面内的内容区块的标题,但也可以包含其他内容,例如数据表格.搜索表单或相关的LOGO图片. 二.footer元素 footer元素可以作为其上层父级内容区块或一个根区块的脚注.footer通常包括其相关区块的脚注信息,如作者.相关阅读链接以及版权信息等…

了解HTML表单之input元素的23种type类型

目录传统类型 text password file radio checkbox hidden button image reset submit 新增类型 color tel email url search number range date month week time datetime datetime-local 前面的话随着HTML5的出现,input元素新增了多种类型,用以接受各种类型的用户输入.其中,button.checkbox.file.hidden.image.pas…

html5中关于input使用方法的改变

測试环境:Firefox 10.0.Safari 5.1.Opera 11.61, Chrome 14.0.835.202 自己測试的时候都有写在form表单里,有提交button验证.由于对博客使用还不是非常熟练,发博文的时候仅仅有舍弃submit验证.大家在本地练习的时候能够写上submit验证,看各个浏览器的对这些新增的类型验证的差别. 一.新增的属性和属性值在HTML5中,大幅度地添加与改良了input属性的种类,能够简单的使用这些属性来实现之前须要使用JavaScript才干实现的.…

【笔记：HTML5中input元素新增的type值】的更多相关文章