Как сделать поле c типом password частично видимым?

Question

[kachurynets]

Как сделать чтобы на при вводе данных пользователь на выходе в данном поле получал частично скрытые знаки кроме последних четырех?
Чтобы на выходе было примерно такое *****0000
Можно ли это сделать это с помощью чистого html или для этого можно использовать какую-то либу?

Answer 1

[Игорь]

Comments

[kachurynets]

а как добавить звездочки?

[Игорь]

kachurynets, JS в помощь

[Игорь]

kachurynets, Обновил ответ

[Игорь]

kachurynets, это то что вам надо?

Answer 2

[kachurynets]

<p class='num'>
    <input class='number' />
<input class='value' />
    
</p>

$('.value').on('keydown keyup mousedown mouseup', function() {
    	 var res = this.value, //grabs the value
    		 len = res.length, //grabs the length
    		 max = 9, //sets a max chars
    		 stars = len>0?len>1?len>2?len>3?len>4?'XXX-XX-':'XXX-X':'XXX-':'XX':'X':'', //this provides the masking and formatting
    		result = stars+res.substring(5); //this is the result
    	 $(this).attr('maxlength', max); //setting the max length
    	$(".number").val(result); //spits the value into the input
    });

.num{
	position:relative;
}

.number{
	position: absolute;
}

.value{
	position: absolute;
	top:0;
	color: transparent !important;
	background: transparent;
	border:none;
}