移动端input怎么type为password，能吊起数字的键盘，不要字母的

最近项目有个需求，移动端的
实现input输出的是密码那种的，就是输出来的值都是隐藏的，并且得到焦点的弹出的键盘是数字键盘，不要字母的，除了重新数字键盘，还有其他的方法吗？？图片描述

这是原生的，键盘不用一模一样，是数字的就可以，请问大家还有什么办法吗？？？？？？？？？感谢

阅读 7.1k

<input type="tel" name="" value="" placeholder="" class="number"> <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script> <script type="text/javascript"> $(function(){ $(".number").keyup(function(){ $(this).val($(this).val().replace(/\d/,"*")) }) }) </script>

input用number，把input隐藏，显示的是div什么的，用js来生成密码的*，

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        /*reser-start*/
        html, body, h1, h2, h3, h4, h5, h6, hr, p, iframe, dl, dt, dd, ul, ol, li, pre, form, button, input, textarea, th, td, fieldset {
            margin: 0;
            padding: 0;
        }

        body, th, td, button, input, select, textarea {
            font-family: "Microsoft Yahei", "Hiragino Sans GB", "Helvetica Neue", Helvetica, tahoma, arial, Verdana, sans-serif, "WenQuanYi Micro Hei", "\5B8B\4F53";
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }
        #ipt{
            opacity: 0;        
            border: none;
            box-sizing: border-box;    
        }
        #ipt:focus{
            outline: none;
        }
        .passbox{
            position: relative;
            width: 240px;
            height: 50px;
            margin: 0 auto;
            border: #c3c3c3 1px solid;
            background: #FFF;
            cursor: pointer;
        }
        .passbox input{
            width: 100%;
            height: 100%;
            position: absolute;
            z-index: -100;
            left: 0;
            top: 0;
            opacity: 0;
        }
        .passbox .pass{
            width: 100%;
            height: 100%;
            line-height: 50px;
        }
    </style>
</head>
<body>
   <div class="box">
          <div class="passbox">
                  <input type="number" id="ipt"/>    
                  <div class="pass"></div>
          </div>
           <button onclick="aaa()">按钮</button>
   </div>
   <script>
       var ipt = document.querySelector("#ipt");
       var pass = document.querySelector(".passbox .pass");
       document.querySelector(".passbox").onclick = function(){
               ipt.focus();
       };  
       ipt.focus();
       function aaa(){
           alert(ipt.value);
       }
       var num = new RegExp(/[0-9]/);
       ipt.oninput = function(){
           var valth = this.value.length;  
           pass.innerText = '';
        var passtext = '';
           for(var i=0;i<valth;i++){
               if(!num.test(ipt.value[i])){
                   ipt.value = ipt.value.substr(0,i);
                   return false;
               }
               passtext +=  '●';
           }
           pass.innerText = passtext;   
       }
   </script>
</body>
</html>

移动端input怎么type为password，能吊起数字的键盘，不要字母的

你尚未登录，登录后可以

CSS如何让指定的某个Tag不显示（比如：display=none），但是还是占有位置呢？

如何实现类似豆包的AI改写框跟随内容滚动效果？

body :first-child(不是body:first-child，中间有空格)伪类选择器到底选中了什么元素？

问一个鼠标滚动事件，这种是怎么实现的？

css如何设置纵向滚动条的高度？

如何在CSS中实现滚动条不溢出圆角框？

form对象根据表单dom元素的name属性获取元素对象是基于什么标准的？兼容性如何？