JSFiddle - React, Tailwind, and code Playground
by cjblomqvist
HTML
<script src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.css">
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Page Title</title>
</head>
<body class="ui-mobile-viewport">
<div id="page1" data-role="page">
<div data-role="header">
<h1>Page 1</h1>
<a href="#page2" class="ui-btn-right">Page2</a>
</div>
<div id="content" data-role="content">Content<p>
1. Click page2 button to go to page 2.<br/>
2. Click diag button to bring up dialog.<br/>
3. With the dialog visible execute the following code to go back to page 2:
$.mobile.changePage('#page2')<br/>
4. Now try going back using the back button on the page. Notice it takes two clicks before you go back to page1. <br/>
</p></div>
<div data-role="footer">
</div>
</div>
<div id="page2" data-role="page" data-add-back-btn="true">
<div data-role="header">
<h1>Page 2</h1>
<a href="#diag" class="ui-btn-right" data-rel="dialog">Diag</a>
</div>
<div id="content" data-role="content">Content<p>
1. Click page2 button to go to page 2.<br/>
2. Click diag button to bring up dialog.<br/>
3. With the dialog visible execute the following code to go back to page 2:
$.mobile.changePage('#page2')<br/>
4. Now try going back using the back button on the page. Notice it takes two clicks before you go back to page1. <br/>
</p></div>
<div data-role="footer">
</div>
</div>
<div id="diag" data-role="page">
<div data-role="header">
<h1>Diag</h1>
</div>
<div id="content" data-role="content">Diag<p>
1. Click page2 button to go to page 2.<br/>
2. Click diag button to bring up dialog.<br/>
3. With the dialog visible execute the following code to go back to page 2:
$.mobile.changePage('#page2')<br/>
4. Now try going back using the back button on the page. Notice it takes two clicks before you go back to page1. <br/>
</p></div>
<div...