I need the error message to be shown if the character length in the #nameT id is less than 3 or greater than 20. When I use the && logical operator, it does not function correctly, as when the && is not present, it works perfectly when executing the code step by step.
<style>
.name{
border: .5px solid #C0C0C0;
margin-left: 1em;
margin-right: 1em;
padding: .7em;
margin-bottom: 1em;
}
#error{
display: inline-block;
color: #727171;
border:1px solid #C0C0C0;
padding: .5em;
margin-top: .5em;
display:none;
}
label{
color:grey;
}
</style>
</head>
<body>
<label>Name :<input class="name" id ="nameT" onblur="check()" type="text"></input></label>
<div id="error">Error please type less than 15 characters</div><br/>
<label>Password :<input class="name" type="password"></input></label>
<script language="javascript" type="text/javascript">
function check() {
var length = document.getElementById("nameT").value.length;
var error = document.getElementById("error");
if(length < 20 && length < 3){
error.style.display="inline-block";
}
}
</script>
</body>