I would like to allow the user to enter 1 or two numerical digits, and display the digits followed by a percent sign. If no digits are entered, it should be blank. The attached almost works, but doesn't show the percent sign if only one digit is entered. Can anyone help? Thanks
http://jsfiddle.net/dm8Mb/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<title>Mask</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://cloud.github.com/downloads/digitalBush/jquery.maskedinput/jquery.maskedinput-1.3.js" type="text/javascript"></script>
<script>
$(function(){$(".percent").mask("9?9%");});
</script>
</head>
<body>
<input type="text" name="percent" class="percent" value="" />
</body>
</html>
Try this - http://jsfiddle.net/dm8Mb/12/
$(function(){
$(".percent").mask("9?9%");
$(".percent").on("blur", function() {
var value = $(this).val().length == 1 ? $(this).val() + '%' : $(this).val();
$(this).val( value );
})
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With