jQuery Mobile Popup destroy() Method
Last Updated :
04 Jan, 2022
jQuery Mobile is a JavaScript library built on top of jQuery, it is used to build fast and responsive websites which are accessible on a variety of devices like mobiles, tabs, and desktops, etc.
In this article, we will jQuery Mobile Popup destroy() method to destroy a popup. When we invoke the destroy() method on a popup, the popup functionality is removed from the popup element and it returns to its pre-init state.
Syntax:
$( ".selector" ).popup( "destroy" );
Parameters: This method does not accept any parameter.
CDN Links: To use Popup element, first add jQuery Mobile to your project.
<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>
Example: In the example below, we will open a popup and invoke the destroy() method after 3000ms.
HTML
<!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" />
< title >Popup - reposition method</ title >
< link rel = "stylesheet"
href =
< script src =
</ script >
< script src =
</ script >
< script >
function openAndDestroyPopup(){
$( "#popup1" ).popup( "open",
{positionTo: "#target"} );
// Destroy the popup 3 seconds after opening
setTimeout(() => {
$( "#popup1" ).popup( "destroy");
}, 3000);
}
</ script >
</ head >
< body >
< div data-role = "page" >
< center >
< h2 style = "color: green" >GeeksforGeeks</ h2 >
< h3 >jQuery Mobile Popup destroy Method</ h3 >
< p id = "target" >
Popup will open here and will
destroy after 3 seconds
</ p >
< div data-role = "popup" id = "popup1" >
< p >Welcome to GeeksforGeeks</ p >
</ div >
< button style = "width: 450px;"
onclick = "openAndDestroyPopup()" >
Open & Destroy Popup
</ button >
</ center >
</ div >
</ body >
</ html >
|
Output:
Reference: https://api.jquerymobile.com/popup/#method-destroy
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...