[Javascript] jquery: Using the same alert popup across multiple pages
<!DOCTYPE html>
	<meta charset="utf-8" />
	<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
	<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
	<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

	// Instantiate the popup on DOMReady, and enhance its contents
	$( function() {
		$( "#popup-alert" ).enhanceWithin().popup();
	function ShowAlert(title, message)
		$("#popup-alert").popup("open", {positionTo:"window"});

<body style="margin: 0; padding: 0">
	<div id="popup-alert" data-theme="a">
	<!-- This popup has its theme explicitly defined via data-theme="a"
         because it has no parent from which to automatically inherit
         its theme -->
		<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
		<div style="text-align: center;">
			<h3 id="alert_title">[Title]</h3>
		<div id="alert_message" style="padding: 20px;">
		<div style="text-align: center; padding: 20px;">
			<a href="#" data-rel="back" data-mini="true" data-role="button" data-inline="true">Ok</a>

	<div id="page1" data-role="page">
		<div data-role="header">
		<div role="main" class="ui-content">
			<a href="#popup-alert" data-role="button" data-rel="popup">Open Popup</a>
			<button id="alert_button" data-role="button" data-icon="check" data-theme="a">Open Popup by javascript</button>
			$("#alert_button").click(function(event) {
				ShowAlert("Alert", "This is alert window.");

HTML | PHP | C++ | DirectX11 | Javascript | C# | HTML5 | ASP | SQL | General | CSS | Oculus Rift | Unity3d | Virtools SDK | Tip | NSIS | PowerShell | node.js | Web API | RTSP | All
Copyright© 2016 CodeWee.com All rights reserved.