Effect Show:
Directly on the code:
<!DOCTYPE HTML><HTMLLang= "en"><Head> <MetaCharSet= "UTF-8"> <Metaname= "Viewport"content= "Width=device-width, initial-scale=1.0"> <Metahttp-equiv= "X-ua-compatible"content= "Ie=edge"> <title>Document</title> <style>input{width:800px; } </style></Head><Body> <inputID= "card"type= "text"placeholder= "Please enter the bank card number"> <inputID= "Phone"type= "text"placeholder= "Please enter the bank card number"> <Script> varCardinput=document.getElementById ('Card'); varPhoneinput=document.getElementById ('Phone'); //Analog Data varStr= '6228480402564890018'; varPhone= '13367678989'; //Bank card number Filter functionStringhidepart (strobj) {varStrlength=strobj.length; varStar= "'; varStrrel= "'; if(Strlength>6){ varhidesec=strobj.substring (3); //asterisk Section for(varI=7; I<Hidesec.length;i++) {Star+= "*"; } }; Strrel=strobj.substring (0,6) +Star+Strobj.substr (Strobj.length-4); //Strrel=strrel.replace (/\s/g, "). Replace (/(. { 4})/g, "$"); returnStrrel; }; //Bank card number Filter functionStringHidePart2 (strobj) {varStrlength=strobj.length; varStar= "'; varStrrel= "'; if(Strlength>3){ varhidesec=strobj.substring (3); //asterisk Section for(varI=4; I<Hidesec.length;i++) {Star+= "*"; } }; Strrel=strobj.substring (0,3) +Star+Strobj.substr (Strobj.length-4); //Strrel=strrel.replace (/\s/g, "). Replace (/(. { 4})/g, "$"); returnStrrel; }; Window.onload= function(){ //determine if background data exists if(Str.length>0) {Cardinput.value=Stringhidepart (str); Cardinput.setattribute ('Disabled','Disabled') }Else{ //user Input } if(Phone.length>0) {Phoneinput.value=stringHidePart2 (phone); Phoneinput.setattribute ('Disabled','Disabled') }Else{ //user Input } } </Script></Body></HTML>
Hidden part number is asterisk, filter bank card number, mobile phone number