jQuery Mobile popup的defaults选项

jQuery Mobile popup的defaults选项

jQuery Mobile是一套基于HTML5的用户交互widget工具箱,用于各种用途,建立在jQuery之上。

它被设计用来建立快速和响应性的网站,可用于手机、标签和桌面。弹出式窗口在页面上方打开一个新的小窗口,里面有一些数据。弹出式窗口是通过嵌套到页面上的一个链接打开的。

在这篇文章中,我们将学习如何实现jQuery Mobile Popup defaults选项。该defaults 选项不允许小部件的数据值。这改善了启动时间,因为jQuery的自动增强代码不会从widget中获取数据值。

语法 :默认情况下,default选项被设置为false。我们可以用下面的语法来改变它。该参数取一个布尔值。

$("#divID").popup({
    defaults: true
});
  • 获取default选项。
var defaults = $("#divID").popup( "option", "defaults" );
  • 设置default选项。
$("#divID").popup( "option", "defaults", true );

CDN链接 。为您的项目使用以下CDN。

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

例子 。在下面的例子中,我们把data-theme 设置为“b”(dark),但由于defaults 选项true ,它将无法工作。

<!DOCTYPE html>
<html lang="en">
  
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content=
        "width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href=
"https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    <script src=
"https://code.jquery.com/jquery-1.11.1.min.js">
    </script>
    <script src=
"https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js">
    </script>
</head>
  
<body>
    <div data-role="header">
        <h1>GeeksforGeeks</h1>
    </div>
    <center>
        <h3>jQuery Mobile Popup defaults option</h3>
        <div role="main" class="ui-content">
            <a href="#divID" data-rel="popup">
                GeeksforGeeks
            </a>
            <div data-role="popup" id="divID" 
                 data-defaults="true" data-theme="b">
                <p>
                    A Computer Science portal for geeks.
                </p>
  
            </div>
        </div>
    </center>
    <script>
        (document).ready(function() {
            ("#divID").popup({ defaults: true });
        });
    </script>
</body>
</html>

输出:

jQuery Mobile popup的defaults选项

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程