在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ 移動端input怎么type為password,能吊起數(shù)字的鍵盤,不要字母的

移動端input怎么type為password,能吊起數(shù)字的鍵盤,不要字母的

最近項目有個需求,移動端的
實現(xiàn)input輸出的是密碼那種的,就是輸出來的值都是隱藏的,并且得到焦點的彈出的鍵盤是數(shù)字鍵盤,不要字母的,除了重新數(shù)字鍵盤,還有其他的方法嗎??圖片描述

這是原生的,鍵盤不用一模一樣,是數(shù)字的就可以,請問大家還有什么辦法嗎?????????感謝

回答
編輯回答
貓館

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>
2018年6月7日 18:01
編輯回答
若相惜

你看這樣是你需要的嘛

<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>
2017年7月16日 00:32
編輯回答
悶騷型

既然是數(shù)字密碼,那可以這么玩!

<span>
   <!-- 輸幾個顯示幾個-->
   *****
</span>
<input style="display: none" type="tel"/>
2017年5月19日 22:16