Example learning of DOM operations and events in jquery-form validation_jquery

Obviously, doing so will result in a better user experience.
html code:

Copy code The code is as follows:

username:

jquery code:

Copy code The code is as follows:

Okay, now let’s analyze the jquery statements inside in detail.
Look at the DOM operation statement first
$('form:input') This is used to find all the , , <select>, <button> elements under the form element . <br>Similarly, there are $(':text'), $(':checkbox'), etc. Anyway, as long as you understand that only within the form, you can get the corresponding elements through the form selector. <br>parent() is the parent node that finds the matching element. find() is used to search for elements that match an expression. remove() is used to delete elements. <br>is() uses an expression to check the element collection of the current selector, and returns true if there is at least one matching element. <br>appendTo() is to add an element to another element. <br>triggerHandler() is a characteristic method that triggers specific events on the element. <br>Look at the event statement again. <br>keyup() is triggered when the key is pressed upward. <br>It should be easy to understand the above code after understanding each method <br>You may have questions about this code. $parent.find(".formtips").remove(); <br>This sentence is to ensure that there is only one element prompted later. If there is no such sentence, prompt elements will be added all the time.</button></select>