Scribd Logo
Upload

Welcome to Scribd!

  • Jquery:enabled Selector: Syntax

    Uploaded by

    aish
    4 views2 pages

    Original Title

    jQuery Que1

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    4 views2 pages

    Jquery:enabled Selector: Syntax

    Uploaded by

    aish

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 2

    jquery :enabled selector

    The :enabled selector is used to select all enabled form elements. It is a pseudo-class


    selector that can also be used to style the enabled UI elements. By default, the form
    elements are in an enabled state. If some of the form elements are disabled, then
    using the :enabled selector, we can highlight the enabled elements.

    This selector can only be used for the HTML elements that support


    the disabled attribute that
    are <input>, <textarea>, <button>, <option>, <fieldset>, <optgroup>, <select
    >, and <menuitem>.

    Syntax

    1. $(":enabled")  

    The above syntax is similar to the $(''*:enabled'') that selects all enabled form


    elements.

    If we have to select particular enabled elements, we can filter the elements by


    prefixing the selector with element type or the component name. Suppose we have
    to only select the enabled button elements, then it can be written as follows.

    1. $("button:enabled")  

    Let's see some of the illustrations of using the :enabled selector.

    Example1
    In this example, we are styling all enabled form elements using the :enabled selector.
    Here, there is a form, including some disabled and enabled elements.

    We have to click the given enabled button to see the effect. On clicking the button,
    the selector will highlight all enabled elements.

    1. <!DOCTYPE html>  
    2. <html>  
    3.   
    4. <head>  
    5. <title> jQuery :enabled selector </title>  
    6. <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </
    script>  
    7.   
    8. <script>  
    9. $(document).ready(function() {  
    10. $('button').click(function(){  
    11. $(":enabled").css({"background-color": "yellow", "border": "2px dashed blue"});  
    12. });  
    13. });  
    14. </script>  
    15.   
    16. </head>  
    17.   
    18. <body>  
    19. <form action = "#">  
    20. <h1> Welcome to the javaTpoint.com </h1>  
    21. <h2> This is an example of using jQuery :enabled selector </h2>  
    22.   
    23. <div>  
    24. First name:     <input type = "text"> <br/> <br/>  
    25. Middle name: <input type = "text" disabled = "disabled"> <br/>  <br/>  
    26. Last name:      <input type = "text"> <br/>  <br/>  
    27. Mobile no.:     <input type = "text"> <br/>  <br/>  
    28. Telephone:      <input type = "text" disabled = "disabled"> <br/> <br/>  
    29. <input type = "submit" id = "inp" disabled = "disabled">  
    30. <button> Click me </button>  
    31. </div>  
    32.   
    33. </form>  
    34.   
    35. </body>  
    36.   
    37. </html>  

    You might also like