jQuery | :disabled Selector

The :disabled selector in jQuery is used to select disabled input elements. Disabled elements are those that are not activated by default or are not currently available for input. This selector is useful when you want to target specific elements that are disabled on a page.

The syntax for using the :disabled selector in jQuery is as follows:

$(":disabled")

This will select all input elements that are currently disabled on the page.

Example

Let's say you have a form with several input fields, some of which are disabled. You want to select and manipulate the disabled fields using jQuery. Here's how you can do that:

<form>
  <label for="name">Name:</label>
  <input type="text" id="name" name="name">

  <label for="email">Email:</label>
  <input type="email" id="email" name="email" disabled>

  <label for="phone">Phone:</label>
  <input type="tel" id="phone" name="phone" disabled>

  <input type="submit" value="Submit">
</form>

$("input:disabled").css("background-color", "lightgray");

In this example, we are using the :disabled selector to select the email and phone input fields that are disabled. Then, we are manipulating their background-color using css() method in jQuery.

Browser Support

The :disabled selector is supported by all modern browsers, including Chrome, Firefox, Safari, Edge, and Internet Explorer 9 and above.

However, it is important to note that older versions of Internet Explorer (8 and below) do not support this selector. If you need to support these browsers, you can use a polyfill or a different approach to achieve the same effect.