新开发的一个功能，采用模拟支付宝手机端输入密码的UI界面，整体功能还不错。请参见下面的屏幕截图。附件中还提供了全套源码下载。HTML代码：手机密码输入框JavaScript代码为上述HTML代码中passwordBox.min.js文件的源代码varpwdBox=PwdBox={template:'.flexable{display:-webkit-box;}.flexable>div{-webkit-box-flex:1;}.flexable.password>div{opacity:0};.flexable。password>div.active{opacity:1!important;}.password{margin:12px25px;}.password>div{height:46px;line-height:46px;text-align:center}.password>div:first-child{border-top-left-radius:5px;border-bottom-left-radius:5px}.password>div:last-child{border-top-right-radius:5px;border-bottom-right-radius:5px}.input-box.flexable>div{height:53px}.input-box.flexable>div:active{background:rgba(0,200,200,.5)}.list-block.item-title{font-weight:normal!important;font-size:14px}ulli{position:relative}.close{position:absolute;top:4px;left:4px;font-size:20px;width:22px;text-align:center}h1.title{高度：50px；字体大小：18px；行高：50px；文本对齐：居中；边距：0；}.notice{高度：30px；行高：30px；字体大小：12px；文本对齐：center;margin-bottom:15px;color:#00a9dd;}'+''+''+'×'+'支付密码'+''+'●'+'●'+'●'+'●'+'●'+'●'+''+''+'请输入支付密码！'+''+''+''+''+''+''+''+''+''+''+''+''+''+''+''+'',passwordOrg:'',password:'',inited:false,callback:function(res){if(res){alert('密码正确');document.querySelector('.password-box').style.display='none'}else{alert('密码错误')}},init:function(password,keyboard,title,notice){if(pwdBox.inited){return}console.log(document.getElementsByTagName('body'));document.getElementsByTagName('body')[0].innerHTML+=pwdBox.template;if(keyboard){document.querySelector('.password-box.inner-box').style.backgroundImage=keyboard}title&&(document.querySelector('h1.title').innerText=title);注意&&(document.querySelector('.password-box.notice').innerText=notice);密码&&(pwdBox.passwordOrg=密码);document.querySelector('.close').addEventListener('click',function(){document.querySelector('.password-box').style.display='none';pwdBox.reset()});varinputs=document.querySelectorAll('.input-key');for(vari=0;idiv');for(vari=0;i
