PARTE EM JAVASCRIPT
<script>
function verifica() {
var texto = document.form.valor.value;
if(texto=="") {
document.getElementById("senha").style.width="0";
document.getElementById("senha").style.background="white";
document.getElementById("texto").innerHTML="coloque sua senha";
return false;
}
var valor_num = 0;
var valor_let = 0;
for(var i = 0; i < texto.length; i++) {
if(isNaN(texto.substring(i, i+1))) {
valor_let=valor_let+1;
} else {
valor_num=valor_num+1;
}
}
if(valor_num==texto.length || valor_let==texto.length) {
document.getElementById("senha").style.width="40";
document.getElementById("senha").style.backgroundColor="blue";
document.getElementById("texto").innerHTML="senha fraca";
return false;
}
else if(valor_num!=texto.length || valor_let!=texto.length) {
if(texto.length < 4) {
document.getElementById("senha").style.width="40";
document.getElementById("senha").style.backgroundColor="blue";
document.getElementById("texto").innerHTML="senha fraca";
return false;
}
else if(texto.length > 4 && texto.length < 7) {
document.getElementById("senha").style.width="80";
document.getElementById("senha").style.background="yellow";
document.getElementById("texto").innerHTML="senha regular";
return false;
}
else if(texto.length > 6) {
document.getElementById("senha").style.width="140";
document.getElementById("senha").style.background="green";
document.getElementById("texto").innerHTML="senha boa";
return false;
}
}
}
</script>PARTE EM CSS
<style>
.div{
height:22px;
background-color:#ffffff;
}
</style>PARTE EM HTML
<table>
<tr>
<form name="form" action="">
<td><input type="text" name="valor" value="" maxlength="8" onKeyup="verifica()" autocomplete="off"></td>
</tr><tr>
<td><div id="senha" class="div"></div></td>
</tr><tr>
<td align="center"><div id="texto"></div></td>
</tr><tr>
<td><input type="submit"></td>
</tr>
</form>
</table>