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 ...
随机推荐
- C#中DBNull.Value和Null的用法和区别
DBNull.Value,, 是适用于向数据库的表中插入空值.而 null,是指在程序中表示空引用. 或者对象为空.就是没有实例化. row[column]的值为DBNull.Value的话,至少说明 ...
- groovy入门(2-1)Groovy的Maven插件安装:Plugin execution not covered by lifecycle configuration
参考链接:http://www.cnblogs.com/rightmin/p/4945797.html 1.引入groovy的jar包 2.引入groovy编译插件 3.遇到问题 Plugin exe ...
- OAuth2.0学习(1-5)授权方式2-简化模式(implicit grant type)
授权方式2-简化模式(implicit grant type) 简化模式(implicit grant type)不通过第三方应用程序的服务器,直接在浏览器中向认证服务器申请令牌,跳过了"授 ...
- DevExpress 控件中GridControl的使用
近期开发用到了DevExpress系列的控件,GridControl是我用到的Dev系列控件最多的一个控件.现在先来总结一下: 首先先写一个简单的小例子来简单介绍一下GridControl的用法: 1 ...
- Linux:crontab组件部署linux定时任务
crontab简介 crond 是linux下用来周期性的执行某种任务或等待处理某些事件的一个守护进程,与windows下的计划任务类似,当安装完成操作系统后,默认会安装此服务 工具,并且会自动启动c ...
- 使用交互式方式在SQL server2017上创建数据库
软件基础:在电脑上提前安装好SQL server2017,并且安装好其中的SSMS(SQL server Management Studio) 创建方式:交互式 操作内容:创建学生课程数据库系统 步骤 ...
- 卷积神经网络的一些经典网络(Lenet,AlexNet,VGG16,ResNet)
LeNet – 5网络 网络结构为: 输入图像是:32x32x1的灰度图像 卷积核:5x5,stride=1 得到Conv1:28x28x6 池化层:2x2,stride=2 (池化之后再经过激活函数 ...
- 控件篇:CheckedListBox的全选与反选
private void cbXmlAll_CheckedChanged(object sender, EventArgs e) { for (int i = 0; i < cblXmlList ...
- 格式化输出prettify()
BeautifulSoup的格式化输出函数: print(soup.prettify())
- 如何用Math.max.apply()获取数组最大/小值
最近似乎对JavaScript有点兴趣了~~~打算好好钻研这个东西.可是,一开始就遇到问题了!!! Math.min.apply(obj,args);//这个obj对象将代替Function类里thi ...