jQuery Mobile Collapsibleset enable() Method

Last Updated : 23 Jul, 2025

jQuery Mobile is a web-based technology that is used to make responsive content for websites that can be accessed on all types of smartphones, tablets, and desktops.

In this article, we will be using the jQuery Mobile Collapsibleset enable() method to enable the collapsibleset and this also does not accept any parameter.

Syntax:

$( ".selector" ).collapsibleset( "enable" );

Arguments: This method does not accept any argument.

Return Value: This method enabled the effective widget.

CDN Link: Below are some jQuery Mobile scripts that will be needed for your project so add these to your project.

<link rel="stylesheet" href="//code.jquery.com/mobile/1.5.0-alpha.1/jquery.mobile-1.5.0-alpha.1.min.css">
<script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="//code.jquery.com/mobile/1.5.0-alpha.1/jquery.mobile-1.5.0-alpha.1.min.js"></script>

Example: This example describes the uses of the jQuery Mobile Collapsibleset enable() method.

HTML 
<!doctype html>
<html lang="en">
    
<head>
    <meta charset="utf-8">
    <meta name="viewport" 
          content="width=device-width, initial-scale=1">
    <link rel="stylesheet" 
          href=
"//code.jquery.com/mobile/1.5.0-alpha.1/jquery.mobile-1.5.0-alpha.1.min.css">
    <script src=
"//code.jquery.com/jquery-3.2.1.min.js">
    </script>
    <script src=
"//code.jquery.com/mobile/1.5.0-alpha.1/jquery.mobile-1.5.0-alpha.1.min.js">
    </script>
        
    <script>
        $(function () {
            $("#btn").on('click', function () {
                $("#divID").collapsibleset("enable");
            });
        });

        $(document).ready(function () {
            $("#divID").collapsibleset("disable");
        });
    </script>
</head>
    
<body>
    <center>
        <div data-role="page" id="page1">
            <div data-role="header">
                <h1 style="color:green;">GeeksforGeeks</h1>
                <h3>
                    jQuery Mobile Collapsibleset Enable() Method
                </h3>
            </div>
            <div role="main" class="ui-content">
                <div data-role="collapsibleset" 
                     class="ui-collapsible-set" 
                     data-corners="false" id="divID">
                    <div data-role="collapsible" 
                        data-collapsed="false">
                        <h3>HTML</h3>
                        <p>
                            HTML stands for HyperText Markup 
                            Language. It is used to design 
                            web pages using a markup language.
                            HTML is the combination of 
                            Hypertext and Markup language. 
                            Hypertext defines the link 
                            between the web pages.
                        </p>
                    </div>
    
                    <div data-role="collapsible">
                        <h3>CSS</h3>
                        <p>
                            CSS (Cascading Style Sheets) is 
                            a stylesheet language used to 
                            design the webpage to make it 
                            attractive. The reason of using 
                            CSS is to simplify the process 
                            of making web pages presentable.
                        </p>
                    </div>  
    
                    <div data-role="collapsible">
                        <h3>JavaScript</h3>
                        <p>
                            JavaScript is the world most 
                            popular lightweight, interpreted 
                            compiled programming language. 
                            It is also known as scripting 
                            language for web pages. 
                        </p>
                    </div>
                </div>
            </div>
    
            <input type="button" id="btn"
                style="width:250px;" value="Enable">
        </div>
    </center>
</body>
</html>

Output:

jQuery Mobile Collapsibleset enable() Method

Reference: https://api.jquerymobile.com/collapsibleset/#method-enable

Comment

Explore