HTML5 Email input pattern attribute

Question

I’m trying to make a html5 form that contains one email input, one check box input, and one submit input. I'm trying to use the pattern attribute for the email input but I don't know what to place in this attribute. I do know that I'm supposed to use a regular expression that must match the JavaScript Pattern production but I don't know how to do this.

What I'm trying to get this attribute to do is to check to make sure that the email contains one @ and at least one or more dot and if possible check to see if the address after the @ is a real address. If I can't do this through this attribute then I'll consider using JavaScript but for checking for one @ and one or more dot I do want to use the pattern attribute for sure.

The pattern attribute needs to check for:

1. Only one @
2. One or more dot
3. And if possible check to see if the address after the @ is a valid address

An alternative to this one is to use a JavaScript but for all the other conditions I do not want to use a JavaScript.

Fairhaired

Why not just use an email input type? – Extraditable

The HTML5 email input treats foo@bar as valid. While it may be technically valid (for example, foo@localhost is a valid email), for most real world use cases, it's not going to work, and users may end up not getting emails as they've missed the .com (or whatever) off – Oujda

See this answer for another solution, which also includes patterns for other types of inputs. – Fabled

Spec: HTML 5.2 spec section 4.10.5.3.6. The pattern attribute – Omit

Relevant: facebook.com/groups/… – Ursa

Answer 1

This is a dual problem (as many in the world wide web world).

You need to evaluate if the browser supports html5 (I use Modernizr to do it). In this case if you have a normal form the browser will do the job for you, but if you need ajax/json (as many of everyday case) you need to perform manual verification anyway.

.. so, my suggestion is to use a regular expression to evaluate anytime before submit. The expression I use is the following:

var email = /^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$/;

This one is taken from http://www.regular-expressions.info/ . This is a hard world to understand and master, so I suggest you to read this page carefully.

Swelling

One thing to note here is that the HTML5 form validation email pattern will allow for all of the valid email address formats. That includes local domain email addresses such as foo@bar without a TLD. Most regex patterns do not cater for the full list of valid cases. (such as the case above) – Kelwin

There is no a silver bullet regex for email, since the emails can be: "ABC"<user@server> or at least [email protected] Last thing is tag, when actual address is prepended with a tag that allow to group the messages. eg. [email protected] will be delivered to [email protected] ddress – Brower

The regex for e-mail here is completely broken and should not be used. Top level domains can be way outside of 2 to 4 characters, and that's just the tip of the iceberg. – Ursa

To fix it not to fail on capital letter just add /i flag like this: /^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$/i – Frizzle

It does not support the current standard for valid email addresses, which allows for international unicode characters to support non-latin languages and diacritics: rfc-editor.org/info/rfc6530 – Understrapper

Answer 2

I had this exact problem with HTML5s email input, using Alwin Keslers answer above I added the regex to the HTML5 email input so the user must have .something at the end.

<input type="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" />

Milreis

This regex is completely broken. Do not use it or you will be throwing out a lot of good addresses. – Ursa

Sidenote: Using type="email" and the pattern in the latest version of Firefox (44,45) failed. I had to use type="text" in order for the pattern to work. – Spirant

Be careful with this one because it do not let emails from new top-level domains (such as .asia or .club) though – Sadonia

What Sergey said and also this comment from above stackoverflow.com/questions/5601647/… @HackbalTeamz - it means end of line or string, see also: duckduckgo.com/… – Utopian

the type="email" does the basic job already in modern browsers. So using pattern attribute just overrides the default behavior. – Clericalism

It should be noted that as of 08/2023, the longest TLD is 7 letters (.website). So, to make sure you include all possibilities, the end of the pattern should be +\.[a-z]{2,7}$ – Hootenanny

@Ursa I believe you should escape - signs, like this: [a-z0-9._%+\-]+@[a-z0-9.\-]+\.[a-z]{2,4}$ Look at other improvements in this question as well - there are some more improvements, like longer TLD support or case insensitivity. – Hasdrubal

type="email" does the job I think we use pattern for text type in this case. – Trainor

Answer 3

Unfortunately, all suggestions except from B-Money are invalid for most cases.

Here is a lot of valid emails like:

• gü[email protected] (German umlaut)
• антон@россия.рф (Russian, рф is a valid domain)
• chinese and many other languages (see for example International email and linked specs).

Because of complexity to get validation right, I propose a very generic solution:

<input type="text" pattern="[^@\s]+@[^@\s]+\.[^@\s]+" title="Invalid email address" />

It checks if email contains at least one character (also number or whatever except another "@" or whitespace) before "@", at least two characters (or whatever except another "@" or whitespace) after "@" and one dot in between. This pattern does not accept addresses like lol@company, sometimes used in internal networks. But this one could be used, if required:

<input type="text" pattern="[^@\s]+@[^@\s]+" title="Invalid email address" />

Both patterns accepts also less valid emails, for example emails with vertical tab. But for me it's good enough. Stronger checks like trying to connect to mail-server or ping domain should happen anyway on the server side.

BTW, I just wrote angular directive (not well tested yet) for email validation with novalidate and without based on pattern above to support DRY-principle:

.directive('isEmail', ['$compile', '$q', 't', function($compile, $q, t) {
    var EMAIL_PATTERN = '^[^@\\s]+@[^@\\s]+\\.[^@\\s]+$';
    var EMAIL_REGEXP = new RegExp(EMAIL_PATTERN, 'i');
    return {
        require: 'ngModel',
        link: function(scope, elem, attrs, ngModel){
            function validate(value) {
                var valid = angular.isUndefined(value)
                    || value.length === 0
                    || EMAIL_REGEXP.test(value);
                ngModel.$setValidity('email', valid);
                return valid ? value : undefined;
            }
            ngModel.$formatters.unshift(validate);
            ngModel.$parsers.unshift(validate);
            elem.attr('pattern', EMAIL_PATTERN);
            elem.attr('title', 'Invalid email address');
        }
    };
}])

Usage:

<input type="text" is-email />

For B-Money's pattern is "@" just enough. But it decline two or more "@" and all spaces.

Iover

Have been searching for decent solution for a while now, this works !! Thanks Dude ! – Thyroxine

When I paste gü[email protected] into input type="email" pattern="[^@\s]+@[^@\s]+\.[^@\s]+", then the input gets tagged :invalid. – Megohm

@JenniferMichelle that's because even input type="email" doesn't do validation right. But depending on your use case it could be still fine. – Iover

I started with the proposed pattern for email extraction from json and finally I finish with this pattern: [^@\s\"\.]+@[^@\s\"]+\.[^@\s\"]+ – Analog

This opens up to way too many other invalid characters in an email. Email address &*()@!$%^.com is valid in this case. There are ways to match unicode, this is not it. Here's a good start: unicode.org/reports/tr18. Also, this is a poor use of title attribute. To a screen reader, that field will always read "Invalid email address" when perhaps it isn't. The title attribute isn't meant to be a validation message alone. Consider "Enter a valid email address" instead as the title. – Ineducable

This accepts tlds with one char. Can it be changed to 2+ chars? Thanks. – Heptangular

Try [^@\s]+@[^@\s]+\.[^@\s][^@\s]+ or [^@\s]+@[^@\s]+\.[^@\s]{2,64} – Iover

Answer 4

In HTML5 you can use the new 'email' type: http://www.w3.org/TR/html-markup/input.email.html

For example:

<input type="email" id="email" />

If the browser implements HTML5 it will make sure that the user has entered a valid email address in the field. Note that if the browser doesn't implement HTML5, it will be treated like a 'text' type, ie:

<input type="text" id="email" />

Goingson

The problem with this approach is that the email type input will validate "s@s", which, of course, is an invalid email address. So, this is the reason why an email input should have a pattern. – Roundfaced

Of course is s@s an absolutely valid email address. Furthermore, even " "@sis a valid email address. – Iover

No need for overkill. If you want a better version, check if it contains one dot after @. Example format: [email protected] – Barr

@AliMertCakar But [email protected] is a valid email address, isn't it? – Sender

@Sender Yes, for example companies use mails like (@)marketing.company.com as every subdomain has different "reputation" (meaning if your subdomain is flagged your other (sub)domains won't be). So you should check for @, minimum one dot after @, and minimum 1 letter for each part. – Barr

@AliMertCakar It seems I misunderstood your "check if it contains one dot after" to mean "one and only one dot after" when you meant "at least one dot after." Thanks for clarifying; that makes sense now. I suppose it might also be a good idea to make sure that none of the dots are adjacent and that the ending character isn't a dot. – Sender

@Sender but [email protected] is valid adress too. as most mail services ignore dots on the left side :) – Barr

@AliMertCakar Ignore dots on the left side? So [email protected] is the same as [email protected]? – Sender

yes for general mail services like gmail. try sending a mail to your gmail account with dots on the left side. [email protected] is the same as [email protected] – Barr

@AliMertCakar I didn't know that. Interesting! Thanks for explaining. I guess there are more specific services that use dots, like my father's Notre Dame email was [email protected]. That's the one I was thinking of. – Sender

Answer 5

This is the approach I'm using and you can modify it based on your needs:

^[\w]{1,}[\w.+-]{0,}@[\w-]{2,}([.][a-zA-Z]{2,}|[.][\w-]{2,}[.][a-zA-Z]{2,})$

Explanation:

1. We want to make sure that the e-mail address always starts with a word:

   ^[\w]

A word is any character, digit or underscore. You can use [a-zA-Z0-9_] pattern, but it will give you the same result and it's longer.

2. Next, we want to make sure that there is at least one such character:

   ^[\w]{1,}

3. Next, we want to allow any word, digit or special characters in the name. This way, we can be sure that the e-mail won't start with the dot, but can contain the dot on other than the first position:

   ^[\w]{1,}[\w.+-]

4. And of course, there doesn't have to be any of such character because e-mail address can have only one letter followed by @:

   ^[\w]{1,}[\w.+-]{0,}

5. Next, we need the @ character which is mandatory, but there can be only one in the whole e-mail:

   ^[\w]{1,}[\w.+-]{0,}@

6. Right behind the @ character, we want the domain name. Here, you can define how many characters you want as minimum and from which range of characters. I'd go for all word characters including the hyphen [\w-] and I want at least two of them {2,}. If you want to allow domains like t.co, you would have to allow one character from this range {1,}:

   ^[\w]{1,}[\w.+-]{0,}@[\w-]{2,}

7. Next, we need to deal with two cases. Either there's just the domain name followed by the domain extension, or there's subdomain name followed by the domain name followed by the extension, for example, abc.com versus abc.co.uk. To make this work, we need to use the (a|b) token where a stands for the first case, b stands for the second case and | stands for logical OR. In the first case, we will deal with just the domain extension, but since it will be always there no matter the case, we can safely add it to both cases:

   ^[\w]{1,}[\w.+-]{0,}@[\w-]{2,}([.][a-zA-Z]{2,}|[.][a-zA-Z]{2,})

This pattern says that we need exactly one dot character followed by letters, no digits, and we want at least two of them, in both cases.

8. For the second case, we will add the domain name in front of the domain extension, thus making the original domain name a subdomain:

   ^[\w]{1,}[\w.+-]{0,}@[\w-]{2,}([.][a-zA-Z]{2,}|[.][\w-]{2,}[.][a-zA-Z]{2,})

The domain name can consist of word characters including the hyphen and again, we want at least two characters here.

9. Finally, we need to mark the end of the whole pattern:

   ^[\w]{1,}[\w.+-]{0,}@[\w-]{2,}([.][a-zA-Z]{2,}|[.][\w-]{2,}[.][a-zA-Z]{2,})$

10. Go here and test if your e-mail matches the pattern: https://regex101.com/r/374XLJ/1

Kreplach

Thanks for the highly detailed information. But according to this wiki [email protected] is a valid email, but your pattern doesn't match it. – Sheet

@Sheet You're right, but that's by design. In the step number 6, I stated that for the domain name, we will use at least two characters {2,} and if you want to allow domains like t.co or your s.solutions, you would have to allow only one character from this range {1,}. If you edit the pattern accordingly, your domain will match. Once you understand the construction principles of patterns, you can alter them any way you like :) Here's the altered pattern for your e-mail: regex101.com/r/374XLJ/2 – Kreplach

Just being pedantic here so : an email address must not exceed 254 characters. Adding that check too would make it a more complete example. – Javierjavler

Great, thank you for the pattern and explanation. I'm going to link this to an answer from angular. – Apicella

Regex patterns offer the shortcut * for {0,} and + for {1,} and you can use \. to match a period character so you don't have to define a character range. Since you need a domain name and extension in any case, you do not need to split these in your (a|b) token but you can simply add the optional domain name in between. Thus, shorten your regex to ^[\w]+[\w.+-]*@[\w-]{2,}(\.[\w-]{2,})?\.[a-zA-Z]{2,}$. The shortcut ? stands for {0,1}, so it is optional but may not occur more than once. – Dupont

None of those will work because the HTML5 pattern regex attribute is anchored by default. Working patterns are required to match (and consume) the entire string. – Heptangular

Answer 6

A simple good answer can be an input like this:

2021 UPDATED & Support IE10+

^(?![_.-])((?![_.-][_.-])[a-zA-Z\d_.-]){0,63}[a-zA-Z\d]@((?!-)((?!--)[a-zA-Z\d-]){0,63}[a-zA-Z\d]\.){1,2}([a-zA-Z]{2,14}\.)?[a-zA-Z]{2,14}$

input:not(:placeholder-shown):invalid{
  background-color:pink;
  box-shadow:0 0 0 2px red;
}
/* :not(:placeholder-shown) = when it is empty, do not take as invalid */
/* :not(:-ms-placeholder-shown) use for IE11 */
/* :invalid = it is not followed pattern or maxlength and also if required and not filled */
/* Note: When autocomplete is on, it is possible the browser force CSS to change the input background and font color, so i used box-shadow for second option*/

Type your Email:
<input 
  type="email"
  name="email"
  lang="en"
  maxlength="254"
  value=""
  placeholder="[email protected]"
  autocapitalize="off" spellcheck="false" autocorrect="off"
  autocomplete="on"
  required=""
  inputmode="email"
  pattern="(?![_.-])((?![_.-][_.-])[a-zA-Z\d_.-]){0,63}[a-zA-Z\d]@((?!-)((?!--)[a-zA-Z\d-]){0,63}[a-zA-Z\d]\.){1,2}([a-zA-Z]{2,14}\.)?[a-zA-Z]{2,14}">

According to the following:

• Resources about standard Email format: What characters are allowed in an email address?
• Resources about standard HTML Email input attributes:

https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/email

• Maximum length of domain in URL (254 Character)
• Longest possible Subdomain(Maybe =0-64 character), Domain (=0-64 character), First Level Extension(=2-14 character), Second Level Extension(Maybe =2-14 character) as @Brad motioned.
• Avoiding of not usual but allowed characters in Email name and just accepting usual characters that famous free email services like Outlook, Yahoo, Gmail etc. will just accept them. It means accepting just : dot (.), dash (-), underscore (_) just in between a-z (lowercase) or A-Z (uppercase - just because it is common - thanks to Badri Paudel) and numbers and also not accepting double of them next to each other and maximum 64 characters.

Note: Right now, longer address and even Unicode characters are possible in URL and also a user can send email to local or an IP, but i think still it is better to not accepting unusual things if the target page is public.

Explain of the regex:

1. (?![_.-]) not started with these: _ . -
2. ((?!--)[a-zA-Z\d-]) accept a till z and A till Z and numbers and - (dash) but not --
3. ((?![_.-][_.-])[a-zA-Z\d_.-]) from a till z lowercase and A till Z uppercase and numbers and also _ . - accepted but not any kind of double of them.
4. {0,63} Length from zero till 63 (the second group [a-zA-Z\d] will fill the +1 but just do not let the character be _ . -)
5. @ The at sign
6. (rule){1,2} this rule should exist 1 or 2 times. (for Subdomain & Domain)
7. (rule)? or ((rule)|) not exist or if exist should follow the rule. (for Second Level Extension)
8. \. Dot

Note: For being more strict about uppercase you can remove all A-Z from the pattern.

Note: For being not strict about Persian/Arabic numbers ٠١٢٣٤٥٦٧٨٩ ۰۱۲۳۴۵۶۷۸۹ you can add \u0660-\u0669\u06f0-\u06f9 next to all \d in the pattern.

Try the RegEx: https://regexr.com/64kjf

Note: Using ^...$ is not necessary in input pattern, but for general RegEx testing will be needed. It means start / end of the string should be same as the rule, not just a part.

Explaining of attributes:

type="email" or type="text" (email In modern browsers will help for the validation also it don't care spaces in start or end for the validation or getting value)

name="email" autocomplete="on" To browser remember easy last filled input for auto completing

lang="en" Helping for default input be English

inputmode="email" Will help to touch keyboards be more compatible

maxlength="254" Setting the maximum length of the input

autocapitalize="off" spellcheck="false" autocorrect="off" Turning off possible wrong auto correctors in browser

required="" This field is required to if it was empty or invalid, form be not submitted

pattern="..." The regex inside will check the validation

---

\w=a-zA-Z\d_ so:

Lightest version
(?![_.-])((?![_.-][_.-])[\w.-]){0,63}[a-zA-Z\d]@((?!-)((?!--)[a-zA-Z\d-]){0,63}[a-zA-Z\d]\.){1,2}([a-zA-Z]{2,14}\.)?[a-zA-Z]{2,14}

Nymph

Seems like it works. Tested many examples. But, your solution doesn't accept uppercase letters, especially frontend shouldn't restrict on that as email can be converted to lowercase at backend or using JS before sending to backend. – Zloty

@badri-paudel Thank you, that is a wise look. actually i wanted to it be lightly strict, because even there is another problem too for my language and it is Persian/Arabic numbers that look same for users but are different in Unicode so \d not supporting them. But still because generally uppercase is more common, i will add it. Also inputmode="email" will help in android for not starting with uppercase. – Nymph

Answer 7

<input name="email" type="email" pattern="[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{1,63}$" class="form-control" placeholder="Email*" id="email" required="">

This is modified version of above solution which accept capital letter as well.

Kourtneykovac

how can I escape the \. character in the pattern? It is causing the line to break with an ""Unrecognised escape character" message. I'm doing this in Razor @Html.TextBoxFor – Motorcycle

This RegEx fails for addresses at a TLD. – Ursa

Answer 8

If you don't want to write a whitepaper about Email-Standards, then use my following example which just introduce a well known CSS-attribute (text-transform: lowercase) to solve the problem:

If you do want the data not to reach the server side as lower case value, then you should go this way:

<input type="email" name="email" id="email" pattern="[a-zA-Z0-9._%+-]+@[a-z0-9.-]+\.[a-zA-Z]{2,4}" style="text-transform: lowercase" placeholder="enter email here ..." required />

---

If you do want the data to reach the server side as lower case value, then you should go this way:

  const emailElmtRegex = new RegExp('[a-zA-Z0-9._%+-]+@[a-z0-9.-]+\.[a-zA-Z]{2,4}');
document.getElementById("entered").innerHTML = "";
document.getElementById("send").innerHTML = ""

function lower() {
    let emailElmt = document.getElementById("email");
    document.getElementById("entered").innerHTML = "Entered: " + emailElmt.value;
    emailElmt.value = emailElmt.value.toLowerCase();

    if (emailElmtRegex.test(emailElmt.value)) {
        document.getElementById("send").innerHTML = "Send: " + emailElmt.value;
    } else {
        document.getElementById("send").innerHTML = ""
    }
}

input[type=email]#email {
   "text-transform: lowercase
}

<!DOCTYPE html>
<html>
<body>
<h3>Client Side to Server Side - Simple Email validation!</h3>
<input type="email" name="email" id="email" pattern="[a-zA-Z0-9._%+-]+@[a-z0-9.-]+\.[a-zA-Z]{2,4}" placeholder="enter email here ..." required oninput="lower()" />

<p id="entered">Entered:</p>
<p id="send">Send:</p>

</body>
</html>

Sunstroke

This only affects how the address is displayed by the browser. Uppercase letters will still be sent to the server on submission. – Fillagree

@GeraldSchneider Fixed! – Sunstroke

Answer 9

<input type="email" pattern="^[^ ]+@[^ ]+\.[a-z]{2,6}$">

Demo - Test the email input

Gaylordgaylussac

The last part should be {2,63} to support TLDs like .solutions – Glittery

Answer 10

You probably want something like this. Notice the attributes:

• required
• type=email
• autofocus
• pattern

<input type="email" value="" name="EMAIL" id="EMAIL" placeholder="[email protected]" autofocus required pattern="[^ @]*@[^ @]*" />

Hobgoblin

this pattern is allowed to type email without ".com" , "your@email" only – Quarta

@VanyDiahP It's entirely valid to have e-mail addresses on a TLD. – Ursa

Answer 11

I used following Regex to satisfy for following emails.

[email protected] # Minimum three characters
[email protected] # Accepts Caps as well.
[email protected] # Accepts . before @

Code

<input type="email" pattern="[A-Za-z0-9._%+-]{3,}@[a-zA-Z]{3,}([.]{1}[a-zA-Z]{2,}|[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,})" />

Dierdre

[email protected] is a valid email address and fails with your regular expression. – Toon

Hey, I have added minimum number of charectors to be 3 before @, That is the reason its failing. "[A-Za-z0-9._%+-]{2,}@[a-zA-Z]{1,}([.]{1}[a-zA-Z]{2,}|[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,})", This should work for you – Dierdre

Ok - so why don't you remove the minimum number of characters before the @ then so your answer is correct. I'll upvote you if you do. :-) – Toon

For me 3 is minimum, I find it ok to have minimum of three charectors. Practically Its hard to find email with 2 or 1 charectors. Thanks. – Dierdre

Works fine, but indeed: changing 3 to something else is necessary. – Kcal

Answer 12

One more solution that is built on top of w3org specification.
Original regex is taken from w3org.
The last "* Lazy quantifier" in this regex was replaced with "+ One or more quantifier".
Such a pattern fully complies with the specification, with one exception: it does not allow top level domain addresses such as "foo@com"

<input
    type="email" 
    pattern="[a-zA-Z0-9.!#$%&amp;’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)+"
    title="[email protected]"
    placeholder="[email protected]"
    required>

Tehee

Answer 13

Updated 2018 Answer

Go here http://emailregex.com/

Javascript:

/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/

Enterotomy

Answer 14

<input type="email" name="email" id="email" value="" placeholder="Email" required />

documentation http://www.w3.org/TR/html-markup/input.email.html

Arcature

All normal peoples use latest version of major browsers, so this is solution will work. I see no reason to focus on people using hopelessly outdated technologies. Especially since the question was about html5. – Arcature

Answer 15

The following regex pattern should work with most emails, including russian emails.

[^@]+@[^\.]+\..+

Scratchboard

It's possible to have an e-mail address at a top-level domain, so no dot in the host part of the address is required. – Ursa

Answer 16

Email Validation Regex using Html5 with angular as below

<div class="item">
      <p>Email Address<span class="required">*</span></p>
      <input type="email" name="to" id="to" placeholder="Email address" tabindex="6" required
        [(ngModel)]="pancard.email" #to="ngModel" pattern="[a-zA-Z0-9._-]*@[a-zA-Z]*\.[a-zA-Z]{2,3}" />
        <div class="alertField" *ngIf="to.invalid && (to.dirty || to.touched)">
          <div *ngIf="to.errors?.['required']">Email is required </div>
          <div *ngIf="to.errors?.['pattern']">Invalid Email Id.</div>
        </div>
    </div>

It is working example..

Petrarch

I would consider removing the {2,3} section of the regex as nowadays there are tld that are longer than this (think of .agency as example). Plus this would not consider valid domains with extensions like .co.uk – Timothee

Answer 17

I have tested the following regex which gives the same result as Chrome Html email input validation.

[a-z0-9!#$%&'*+\/=?^_`{|}~.-]+@[a-z0-9-]+(\.[a-z0-9-]+)*

You can test it out on this website: regex101

Hirohito

Answer 18

^(http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$

Ethnography

Answer 19

pattern="[a-z0-9._%+-]{1,40}[@]{1}[a-z]{1,10}[.]{1}[a-z]{3}"

<input type="email"  class="form-control" id="driver_email" placeholder="Enter Driver Email" name="driver_email" pattern="[a-z0-9._%+-]{1,40}[@]{1}[a-z]{1,10}[.]{1}[a-z]{3}" required="">

Tytybald

You can indent code by 4 spaces to change its formatting. There is a button for that on top when you edit post. – Scalage

This pattern fails for many common TLDs. Don't use it. – Ursa

Answer 20

Try this

pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$"

Ithnan

This pattern fails for many common TLDs. Don't use it. – Ursa