input type="tel" 数字输入框显示圆点
最近开发中遇到一个这样的需求,要求input输入框在手机端出现数字键盘的同时显示圆点,试过各种方法都不太理想,
最终经过查阅大量资料后,终于实现了需求。
●我们一般的密码输入框是这样的:
<input type="password" placeholder="请输入密码">
这个实现了输入密码显示圆点的需求,但是手机上他调出来的是字母键盘,所以不符合开发需求。
●所以最终的密码输入框是这样的:
<input type="tel" maxlength="6" style="-webkit-text-security:circle" placeholder="请输入密码">
释: -webkit-text-security用法,
指定用于在密码输入字段中代替字母的形状。
语法:-webkit-text-security: circle | disc | none | square;
circle:圆形; disc:圆盘形状(句号) none:没有使用形状; square:方形的;
版权声明:本文为博主原创文章,转载需注明出处。http://www.cnblogs.com/silent007/p/8947569.html
*************************************** END *******************************************
input type="tel" 数字输入框显示圆点的更多相关文章
- input type="tel" 输入框显示密文
为了在移动端实现密码输入框且调起的键盘为数字键盘,可以用-webkit-text-security:disc;text-security:disc;属性来实现. 语法: text-security: ...
- [转载]Js小技巧||给input type=“password”的输入框赋默认值
http://www.cnblogs.com/Raywang80s/archive/2012/12/06/2804459.html [转载]Js小技巧||给input type="passw ...
- 上传文件 隐藏input type="file",用text显示
<div> <span>上传文件:</span> <input type="file" id="upload_file" ...
- input[type="file"]上传图片并显示图片
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 限制input[type=number]的输入位数策略整理
当我们使用类型number的input输入框的时候,我们可能需要限制输入的位数,这个时候通常会想到maxlength,但是maxlength是在number类型的时候是不支持的,下面是一些解决这种问题 ...
- 输入类型<input type="number"> / input标签的输入限制
输入限制 属性 描述 disabled 规定输入字段应该被禁用. max 规定输入字段的最大值. maxlength 规定输入字段的最大字符数. min 规定输入字段的最小值. pattern 规定通 ...
- 去掉 input type="number" 右边图标
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- H5 限制input只能输入数字
<input type="tel" /> 参考: http://blog.csdn.net/kongjiea/article/details/40185951
- 动手写个数字输入框1:input[type=number]的遗憾
前言 最近在用Polymer封装纯数字的输入框,开发过程中发现不少坑,也有很多值得研究的地方.本系列打算分4篇来叙述这段可歌可泣的踩坑经历: <动手写个数字输入框1:input[type=nu ...
随机推荐
- 第二章 Idea搭建maven
第二章 Idea搭建maven 1.配置Maven的环境变量 a.首先我们去maven官网下载Maven程序,解压到安装目录,如图所示: b.配置M2_HOME(MAVEN_HOME)的环境变量,然后 ...
- css(1-1)样式表
CSS Id 和 Class id 和 class 选择器 如果你要在HTML元素中设置CSS样式,你需要在元素中设置"id" 和 "class"选择器. id ...
- mangodb的基本操作:增删改差
MongoDB三元素: 1 数据库: 和关系型数据库中数据库的层次相同,内部可以有多个集合. 2 集合: 相当于关系型数据库中的表,存储若干文档,结构不固定 3 文档: 相当于关系型数据库中的行,是J ...
- 丢掉DDL,我用这招3分钟清空 MySQL 9亿记录数据表
摘要:最近由于福建开机广告生产环境的广告日志备份表主键(int类型)达到上限(21亿多),不能再写入数据,需要重新清空下该表并将主键重置,但由于表里有8亿多记录的数据量,使用重置命令及DDL命令执行地 ...
- intelj idea中JRebel激活
1.下载激活软件 https://github.com/ilanyu/ReverseProxy/releases/tag/v1.0 我这边下载的是: 2.双击运行 3.idea中, 不出意外,应该就激 ...
- 脱upx壳--初试--单步追踪
脱upx壳--初试--单步追踪 这里的练习题目是reversing.kr 的Easy Crack 我自己用upx加壳工具给它加了个壳,由于原文件逻辑简单,所以用它来练练手 之后用到的工具是IDA和Ol ...
- Linux平台部署.Net Core SDK
根据微软MSDN,.Net Core无论是1.x还是2.0都只支持64位系统. 准备 以下是.NetCore支持的系统版本 以下 Linux 64 位(x86_64 或 amd64)发行版本/版本支持 ...
- Docker:云栖社区开源论题及Spark开源论题
https://yq.aliyun.com/topic/78?spm=5176.8290451.656547.7.rMYhAF https://yq.aliyun.com/activity/155?u ...
- MongoDB系列五(地理空间索引与查询).
一.经纬度表示方式 MongoDB 中对经纬度的存储有着自己的一套规范(主要是为了可以在该字段上建立地理空间索引).包括两种方式,分别是 Legacy Coordinate Pairs (这个词实在不 ...
- Ajax实现注册无刷新验证用户名是否存在
1. [代码][JavaScript]代码 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 ...