JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc1/jquery.mobile-1.0rc1.min.css">
<script src="http://code.jquery.com/mobile/1.0rc1/jquery.mobile-1.0rc1.min.js"></script>
<div data-role="page" id="mainpage">
<!-- Start of first page -->
<div data-role="header" data-position="inline">
<a href="#mainpage" data-icon="home">主页</a>
<h1>欢迎来到中国移动自助终端</h1>
</div><!-- /header -->
<div data-role="content">
<div class="right-part">
</div>
<div class="left-part">
<ul data-role="listview" data-theme="d">
<li data-role="list-divider" role="heading">功能选择</li>
<li class="nav-li"><a href="#recharge">缴费充值</a></li>
<li class="nav-li"><a href="bill.html">话费查询</a></li>
<li class="nav-li"><a href="bmw.html">选号入网</a></li>
<li class="nav-li"><a href="bmw.html">热点促销</a></li>
<li class="nav-li"><a href="bmw.html">增值业务</a></li>
<li class="nav-li"><a href="bmw.html">3G业务</a></li>
<li class="nav-li"><a href="bmw.html">周边指南</a></li>
<li class="nav-li"><a href="bmw.html">优惠券</a></li>
</ul>
</div>
</div>
<div data-role="footer">
<h4>liuyanghejerry</h4>
</div><!-- /footer -->
</div><!-- /first page -->
<div data-role="page" id="recharge">
<div data-role="header" data-position="inline">
<a href="#mainpage" data-icon="home">主页</a>
<h1>缴费充值</h1>
<a href="#mainpage" data-icon="alert" id="timer">60秒后自动退出</a>
</div><!-- /header -->
<div data-role="content">
<div class="right-part">
<form action="form.php" method="post">
<div data-role="fieldcontain">
<label...
JavaScript
$("#recharge").live('pageshow', function() {
var past = 0;
$('#recharge').everyTime('1s', function(i) {
past++;
$('#timer span > .ui-btn-text').html(60 - past + '秒后自动退出');
if (past == 60) {
$("a[data-icon='home']").trigger("click");
}
});
});
$("#recharge").live('pagehide', function() {
var past = 0;
$('#recharge').stopTime();
$('#timer span > .ui-btn-text').html('60秒后自动退出');
});