html로 입력 텍스트 마스크 및 마스크 해제

Question

SSN, 전화 번호 및 이메일 ID와 같은 텍스트 필드가 거의 없습니다. onfocus와 같은 작업을하고 싶습니다. 입력 상자의 전체 내용을 표시하고 흐리게 처리하면 내용을 다시 마스킹해야합니다 (예 : asterix). 미리 감사드립니다. 미리 감사드립니다.

Answer 1

두 이벤트에서 <input> 요소의 유형을 password과 text 사이에서 전환 할 수 있습니다. 이 내용은 example fiddle을 참조하십시오.

HTML

<input type="password" id="target" /> 

JS

<script> 
var inp = document.querySelector('#target'); 

inp.addEventListener('focus', function(){ 
    inp.type = 'text'; 
}); 
inp.addEventListener('blur', function(){ 
    inp.type = 'password'; 
}); 
</script> 

Answer 2

<input type="password" /> 간단 해.

Answer 3

같이 그것을 시도 :

var emailIdValue = ""; 

$(document).ready(function() { 

    emailIdValue = $('#emailId').val(); 

    $('#emailId').val("********"); 

    $('#emailId').focus(function() { 

      $(this).val(emailIdValue); 

    }).focusout(function() { 

      emailIdValue = $(this).val(); 
      $(this).val('********'); 

    }); 

});