The importance of form validation:
Using JavaScript can be very convenient for form validation. It can not only check the invalid or wrong data entered by the user, but also check the required items that the user has missed, thereby reducing the pressure on the server and avoiding errors in the information on the server side.
form selector
:input: matches all input, textarea, select and button elements;
:text: matches all single-line text boxes;
:password: match all password boxes;
:radio: match all single button;
:checkbox: matches all checkboxes;
:submit: matches all submit buttons;
:image: match all image fields;
:reset: matches all reset buttons;
:button: match all buttons;
:file: match all file fields;
:hidden: match all invisible elements, or elements of type hidden
form attribute filter
:enabled: matches all available elements;
:disabled: matches all unavailable elements;
:checked: matches all checked elements (checkboxes, radio buttons, options in select);
:selected: matches the option element to be selected;
Form validation event method
event:
onblur: loses focus, triggered when the cursor leaves a text box;
onfocus: get the focus, triggered when the cursor enters a text box;
method:
blur(): remove the focus from the text field;
focus(): Set the focus in the text field, that is, get the cursor;
select(): select the content in the text field, highlight
Regular expression:
Define a regular expression:
Normal method:
var reg=/expression/additional parameters/
Expression: A string representing a rule, in which some special characters can be used to represent special rules
Additional parameters: used to expand the meaning of the expression;
parameter:
g: means that global matching can be performed;
i: represents case-insensitive matching;
m: means that multi-line matching can be performed;
Example:
var reg=/white/;
var reg=/white/g;
Constructor:
var reg=new RegExp("white");
var reg=new RegExp("white","g");
illustrate:
The expression in the normal way must be a constant string, while the expression in the constructor can be a constant string or a JavaScript variable.
The pattern of the expression:
Short answer mode:
Short answer patterns refer to patterns expressed by combinations of ordinary characters.
var reg = / china /;
var red = / abc8 /;
Compound mode:
Compound patterns are patterns that specify wildcards to express
var reg = / ^ w + $ /;
RegExp object:
exec(): Retrieves matches in characters that are regular expressions, returns the found value, and determines its position;
test(): Retrieve the value specified in the string and return true over false;
var str="my cat";
var reg=/cat/;
var result=reg.test(str);
Methods of String objects:
match(): finds a match of one or more regular expressions;
search(): retrieves values that match the regular expression;
replace(): replace the string matching the regular expression;
split(): splits a string into an array of strings;
match() method:
var str="my cat";
var reg=/cat/;
var result = str.match (reg);
replace() method:
var str="my little white cat,is really a very lively cat";
var result=str.replace(/cat/,"dog");
var results=str.replace(/cat/g,"dog");
split() method:
var str="red.blue,green,white";
var result=str.split(",");
var string="";
for(var i=0;i<result.length;i++){
string+=result[i]+"\n";
}
alert(string);
Properties of the RegExp object:
global: Whether the RegExp object has the flag g;
ignoreCase: whether the RegExp object has flag i;
multiline: whether the RegExp object has the flag m;
regular expression
Common symbols for regular expressions:
Important characters for regular expressions:
The difference between regular expressions (), [], {}:
(): In order to extract the matched string, there are several () in the expression and there are several corresponding matched strings;
[]: defines the matched string;
{}: used to match the length;
Example:
Validate the form using HTML5
HTML5 adds validation attribute
placeholder：
required：
pattern：
validity property:
Example:
Reprinted in: https://www.cnblogs.com/tinghao/p/11069444.html