jQuery Mobile ist eine webbasierte Technologie, mit der responsive Inhalte erstellt werden, auf die auf allen Smartphones, Tablets und Desktops zugegriffen werden kann. In diesem Artikel wird die Option zum Deaktivieren des jQuery Mobile Collapsible Widget verwendet, um die reduzierbaren Elemente zu deaktivieren, wenn der Wert auf „true“ gesetzt ist. Es akzeptiert einen booleschen Wert und sein Standardwert ist falsch.

Syntax:

$( ".selector" ).collapsible({
    disabled: boolean
});

CDN-Link: Fügen Sie zunächst jQuery Mobile-Skripte hinzu, die für Ihr Projekt benötigt werden.

<link rel=”stylesheet” href=”//code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css”>
<script src=”//code.jquery.com/ jquery-1.10.2.min.js”></script>
<script src=”//code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js”></script >

Beispiel:

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.4.5/jquery.mobile-1.4.5.min.css">
  
    <script src="//code.jquery.com/jquery-1.10.2.min.js">
    </script>
  
    <script src=
"//code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js">
    </script>
  
    <script>
        $(document).ready(function () {
            $("#GFG").collapsible({
                disabled: true
            });
        });
    </script>
</head>
  
<body>
    <div data-role="page" id="page1">
        <div data-role="header">
            <h1>GeeksforGeeks</h1>
            <h3>jQuery Mobile Collapsible Widget disabled Option</h3>
        </div>
  
        <div role="main" class="ui-content">
            <div data-role="collapsible" id="GFG">
                <h3>GeeksforGeeks</h3>
                <p>
                    GeeksforGeeks is a computer science portal
                    for geeks. It contains well written, well
                    thought and well explained computer science
                    and programming articles, quizzes etc.
                </p>
            </div>
        </div>
    </div>
</body>
  
</html>

Ausgabe:

Referenz: https://api.jquerymobile.com/collapsible/#option-disabled