• jQuery Video Tutorials

jQuery :input Selector



The :input selector in jQuery is used to select all Form elements such as <input>, <textarea>,<select>, and <button> elements. It includes all input-related elements, such as text fields, radio buttons, checkboxes, and more.

Syntax

Following is the syntax of jQuery :input selector −

$(":input")

Parameters

The :input selector will select all the input elements.

Example

In the following example, we are using the jQuery :input elements to select all the form elements −

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            // Change the background color of all input elements
            $(":input").css("background-color", "lightblue");
        });
    </script>
</head>
<body>
    <form>
        <input type="text" name="textfield" placeholder="Text Field" /><br>
        <textarea name="textarea" placeholder="Text Area"></textarea><br>
        <select name="select">
            <option value="1">Option 1</option>
            <option value="2">Option 2</option>
        </select><br>
        <button type="submit">Submit</button>
    </form>
</body>
</html>

The selected elements will be highlighted with lightblue background color.

jquery_ref_selectors.htm
Advertisements