HTML Reference Manual

HTML Tag大全

HTML: <input> pattern Attribute

This article introduces the usage of the HTML input pattern attribute, online examples demonstrate how to use the HTML input pattern attribute, browser compatibility, syntax definition, and detailed information about its attribute values, etc.

　HTML <input> tag

Online Example

An HTML form whose input field can only contain three letters (no numbers or special characters):

Example

<!DOCTYPE html>
<html>
<head>
<title>HTML: <input> pattern Attribute　-　Basic Tutorial Website(oldtoolbag.com)</title>
<body>
<form action="action_page.php">
　　Country/Country Code: <input type="text" name="country_code" pattern="[A-Za-z]{3" title="3A country with one letter/Country Code>
　　<input type="submit">
</form>
</html>

Test and see ‹/›

Browser Compatibility

IEFirefoxOperaChromeSafari

Internet Explorer 10, Firefox, Opera and Chrome support the pattern attribute.

Note:Safari or Internet Explorer 9 and earlier versions do not support the pattern attribute of the <input> tag.

Definition and usage

The pattern attribute specifies a regular expression that checks the value of the <input> element when the form is submitted.

Note:pattern attribute is applicable to the following input types: text, search, url, tel, email and password.

Tip:Use the global title attribute to describe the pattern and help the user.

Tip:Learn more about it in our JavaScript tutorial. Regular expression knowledge.

HTML 4.01 and HTML5difference between

pattern attribute is an HTML5 New attribute added in

Syntax

<input pattern="regexp">

Attribute value

Value	Description
regexp	Specify a regular expression to validate the value of the <input> element.

　HTML <input> tag

HTML: <template> tag