jQuery Mobile Dialog close()方法

jQuery Mobile Dialog close()方法

jQuery Mobile是一种网络技术,用于制作响应式网站和应用程序,可以在智能手机、平板电脑和桌面设备上访问。在这篇文章中,我们将使用jQuery Mobile Dialog Widget的close()方法来关闭一个打开的对话框。当close()方法在任何对话框部件上被调用时,它只是关闭了对话框。这个方法不接受任何参数。

语法:

$(".selector").dialog("close");

参数:该方法不接受任何参数。

CDN链接:首先,添加你的项目需要的jQuery Mobile脚本。

<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-2.1.3.js”></script>
<script src=”https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js”></script>

示例:

<!DOCTYPE html>
<html>
  
<head>
    <title>GeeksForGeeks - Dialog Close</title>
    <meta name="viewport" content=
        "width=device-width, initial-scale=1" />
    <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-2.1.3.js">
    </script>
    <script src=
"https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js">
    </script>
  
    <script>
  
        // This method will be called when the 
        // button inside the dialog will be clicked.
        function closeDialog() {
  
            // Invokes close() method on #div2's dialog
            $("#div2").dialog("close");
  
        }
    </script>
</head>
  
<body>
    <div id="div1" data-role="page">
        <div data-role="header">
            <h1>GeeksForGeeks</h1>
            <h4>jQuery Mobile Dialog close() Method</h4>
        </div>
        <div data-role="content">
            <button>
                <a href="#div2">
                    Click to Show the Dialog Box
                </a>
            </button>
        </div>
    </div>
  
    <!-- id ="div2"-->
    <div id="div2" data-role="dialog">
        <div data-role="header">
            <h1>jQuery Mobile - GFG</h1>
        </div>
        <div data-role="content">
            jQuery Mobile - Dialog close() method example.
            <button onclick="closeDialog();">
                This Button Closes the Dialog
            </button>
        </div>
    </div>
</body>
  
</html>

输出:

jQuery Mobile Dialog close()方法

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程