对于某些密码，想要在手机上调出数字键盘，同时要隐藏文字。可结合type=tel和 text-security属性达到目的。

input{

            -webkit-text-security:disc;

            text-security:disc; /*使用指定形状代替文字显示 circle圆圈 disc 圆形 square 正方形*/

        }
<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>输入密码时，调出手机的数字键盘</title>

    <style>

        input{

            -webkit-text-security:disc;

            text-security:disc; /*使用指定形状代替文字显示 circle圆圈 disc 圆形 square 正方形*/

        }

    </style>

</head>

<body>

<input type="tel" id="pass" />

    <script>

        window.onload = init;

        function init(){

            var x = document.getElementById("pass");

            var style = window.getComputedStyle(x);

            if(style.webkitTextSecurity){

                //do nothing

            }else{

                x.setAttribute("type","password");

            }

        }

    </script>

</body>

</html>

input 密码框调出手机的数字键盘的更多相关文章

  1. input验证码框，输入非数字或非12位时，红框提示;每4位加一个空格

    以下代码:input验证码框,输入非数字或非12位时,红框提示;每4位加一个空格 //input验证码框,输入非数字或非12位时,红框提示;每3位加一个空格 $(".text"). ...

  2. input密码框输入后设置显示为星号或其他样式

    预览效果 核心代码 <div class="text-input" :class="right?'textinput-right':''"> < ...

  3. 【自创+转发】jQuery给input 密码框绑定回车事件

    <script type="text/javascript" src="Scripts/jquery-1.6.2.js"></script&g ...

  4. 去掉input密码框自动补全功能

    <input name="password" autocomplete="off" hidden> <input type="pas ...

  5. input输入框直接拉起九宫格数字键盘

    <input type="number" pattern="\d*">

  6. 【笔记】移动端H5数字键盘input type=number的处理（IOS和Android）

    在Vue中的项目,基于VUX-UI开发,一个常见的需求: 1.金额输入框 2.弹出数字键盘 3.仅支持输入两位小数,限制最大11位数,不允许0开头 后续:与UI沟通后, 思路调整为限制输入,并减少正则 ...

  7. VirtualBox中出现UUID have already exists ，并且数字键盘numlock效果相反

    原文地址:https://www.cnblogs.com/xqzt/p/5053338.html 原因:由于linux密码登录错误,修改也报错误,所以只能重新安装虚拟机并在其中安装镜像文件,但是安装镜 ...

  8. input 手机数字键盘

    要一点击提起数字键盘,安卓只要设置input的类型是number或tel, ios 需要 pattern="number"可以直接打开搜狗输入法的数字键盘,可以输入.和数字如果只能 ...

  9. [HTML5]移动开发不同手机弹出数字键盘问题

    这里还是先那么先交代一下遇到的问题.其实无论是tel还是number都不是完美的:type="tel"优点是iOS和Android的键盘表现都差不多缺点是那些字母好多余,虽然我没有 ...

随机推荐

  1. Qt のEXecl

    http://blog.csdn.net/czyt1988/article/details/52121360           OK http://bbs.csdn.net/topics/39184 ...

  2. Qt实现基本QMainWindow主窗口程序

    这个实验用Qt实现基本QMainWindow主窗口 先上实验效果图    打开一个文件,读取文件类容 详细步骤: 1.打开Qt creator新建MainWindow工程 右键工程名添加新文件,mai ...

  3. Sequence query 好题啊

    Sequence query Time Limit: 2000/1000MS (Java/Others) Memory Limit: 128000/64000KB (Java/Others) Subm ...

  4. Python中map()函数浅析

    MapReduce的设计灵感来自于函数式编程,这里不打算提MapReduce,就拿python中的map()函数来学习一下. 文档中的介绍在这里: map(function, iterable, .. ...

  5. iOS开发注意事项(一）

    1.OC的消息机制与C++等的函数(方法)有很大的不同,OC在运行时所执行的代码由运行环境来决定,而C++等则由编译器决定.如果调用的函数是多态的,C++在运行时要按照虚方法表来查出到底执行哪个函数, ...

  6. 标准模型和IE模型的区别：

    标准模型和IE模型的区别:    标准盒子模型的content的宽高不包含其他部分,但是IE盒子模型的content部分包含padding和border 比如:margin=10:border=5:p ...

  7. 一步使你的asp.net网站在手机浏览器上全屏显示

    首先要加入下面的代码: <meta name="viewport" content="width=device-width, initial-scale=1.0, ...

  8. DevOps之平台架构

    唠叨话 关于德语噢屁事的知识点,仅提供精华汇总,具体知识点细节,参考教程网址,如需帮助,请留言. DevOps平台架构(Platform Architecture) <虚拟化平台(Platfor ...

  9. java基础--static关键字的使用

    一.static关键字的作用 使类成员完全独立于该类的任何对象.通常情况下,类成员必须通过它的类的对象访问,但是被static修饰的成员,能够被自己访问,而不必引用特定的实例. 一旦一个成员被声明为s ...

  10. 张高兴的 Windows 10 IoT 开发笔记：使用 MAX7219 驱动 8×8 点阵

    GitHub:https://github.com/ZhangGaoxing/windows-iot-demo/tree/master/MAX7219