jQuery-Mask-Plugin to mask email addresses and web URL's

prime picture prime · Feb 28, 2015 · Viewed 33.1k times · Source

I'm using the jQuery-Mask-Plugin in my application and using that I was able to successfully add masks to telephone numbers, date time .. etc.

$("#date").mask("99/99/9999",{placeholder:"mm/dd/yyyy"});
$("#phone").mask("(999) 999-9999");

But I could not find a way to add masks to email addresses and web site addresses.

I know it is some what tricky to identify exact patterns in those but is there any way in jQuery-Mask-Plugin to do that ?

Answer

Igor Escobar picture Igor Escobar · Dec 7, 2015

There is no such thing as e-mail "mask" because it doesn't have a "fixed" or predictable structure. First, you need to validate your input, always, and that can be done with a simple regexp. Now.. If you want to avoid the user typing things that shouldn't be done you can do this:

$('.alpha-no-spaces').mask("A", {
	translation: {
		"A": { pattern: /[\w@\-.+]/, recursive: true }
	}
});

Hope it helps.