How to find all input elements that are enabled using jQuery?
The jQuery ” :enabled” pseudo-class selector helps to find all the input element that are enabled. This pseudo-class selector should only be used for selecting HTML elements that support the disabled attribute i.e (<button>, <input>, <textarea>, <select>, <option>, <optgroup>)
As with other pseudo-class selector like (a:hover) is also recommended preceding it with a tag name or with some other selector, otherwise the universal selector (“*“) is implied like $( “*:enabled” ) or $( “input:enabled”).
Syntax:
$( "input:enabled" ).val( "This box is enabled" );
Note: (:enabled) select elements that have their boolean disabled property strictly to false.
HTML code: The following code demonstrates the :enabled pseudo-class selector to find all the input elements that are enabled using jQuery.
HTML
<!doctype html> < html lang = "en" > < head > < meta charset = "utf-8" > < meta http-equiv = "X-UA-Compatible" content = "IE=edge" > < meta name = "viewport" content = "width=device-width, initial-scale=1.0" > < title >Elements that are enabled</ title > < script src = "https://code.jquery.com/jquery-3.5.0.js" ></ script > </ head > < body > < h1 style = "color: green; margin-left: 120px;" >w3wiki</ h1 > <!-- The form contains three boxes out of which two boxes are disabled --> < form > <!-- Set input disabled --> < input style = "border: 0.8px solid green;" name = "email" disabled> < input style = "border: 0.8px solid green;" name = "id" > < input style = "border: 0.8px solid green;" name = "email" disabled> </ form > <!-- The val is displayed in the box in which the input element is enabled --> < script > $( "input:enabled" ).val( "This box is enabled" ); </ script > </ body > </ html > |
Output:
Contact Us