JQuery add percent sign to input field

Question

I would like to have an input box that automatically adds a visible percent sign to the user when entering numbers (not just recognizing it as a percentage when sending). Thus, the user presses "2" and sees "2%"

I guess jQuery can use this quite easily, but I have no idea how to do this! Any ideas?

Thanks to everyone.

Answer 1

You can handle the change event:

 $(':input.Percent').change(function() { $(this).val(function(index, old) { return old.replace(/[^0-9]/g, '') + '%'; }); }); 

Answer 2

In Keyup event

 $('input').keyup(function(e) { if(e.which != 13) { //13 is enter, you dont want to submit the form on enter var value = $.trim($(this).val()); if(value != '') { $(this).val(value +'%'); } } else { return false; } });