Reputation: 371
I want to validate my textbox
using jquery
.
If the number of letters' length increased to 6, it will hide my <span>
tag
html:
<input type="password" id="txtpass" value="" onkeyup="KeyUp();"/>
javascript:
function KeyUp () {
var x =$("#txtpass").val();
if (x.length < 6) {
$("span").show()
}
else
(x.length >= 6)
{
$("span").hide();
}
}
Advise please
Upvotes: 0
Views: 35
Reputation: 9813
You can validate the password's length by keyup
or input
event:
$('#txtpass2').on('blur', function() {
var shouldShowAlert = ($(this).val().length < 6);
$("#passAlert2").toggle(shouldShowAlert);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
use oninput<input type="password" id="txtpass" value="" oninput="validatePass(this)"/>
<span id='passAlert'>Length is too short</span>
<script>
function validatePass(target) {
var shouldShowAlert = (target.value.length < 6);
$("#passAlert").toggle(shouldShowAlert);
}
</script>
<br/>
use onblur<input type="password" id="txtpass2" value=""/>
<span id='passAlert2' style="display: none;">Length is too short</span>
Below is jquery way:
$('#txtpass').on('input', function() {
var shouldShowAlert = ($(this).val().length < 6);
$("#passAlert").toggle(shouldShowAlert);
});
Upvotes: 0
Reputation: 5600
Use keyup function of jquery and look for length and show/hide (or use toggle):
$('#txtpass').keyup(function(){
if($(this).val().length < 6){
$("span").show();
}
else if($(this).val().length >= 6){
$("span").hide();
}
});
Upvotes: 1