ページを初期化してナビゲートしようとすると、最初にページが後退します。ページが後退するのはなぜですか。
私はこのようにナビゲートしようとします:$.mobile.changePage("#pagename");
例えば。初期化後、メインからお客様のページに行ってみて、アイコンをクリックします。ナビゲートが終了すると Web ページがナビゲートされ、ページがナビゲートされますが、最初は URL がまだ#...
.
コード:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="styles/jquery.mobile-1.3.1.min.css" />
</head>
<body>
<!-- //////////////////////////////////////////////////////
////////// MAIN PAGE ///////////////
////////////////////////////////////////////////////// -->
<section id="main-page" data-role="page" data-fullscreen="true">
<header data-role="header">
<h1>Főoldal</h1>
</header>
<div data-role="content">
<table>
<tbody>
<tr>
<td>
<div class="metro-bt" onclick="$.mobile.changePage('#customer-page');" id="customer-btn"> <!-- <<<-------------- here I invoke the function change page and than change back, but just at the first time -->
<div></div>
<span>Customers</span>
</div></td>
<td>
<div class="metro-bt" data-bind="click: bt_calendar_click" id="calendar-btn">
<div></div>
<span>Calendar</span>
</div></td>
</tr>
<tr>
<td>
<div class="metro-bt" data-bind="click: bt_negotiation_click, enable:isNegBtEnable" id="negotiation-btn">
<div></div>
<span>Negotiation</span>
<span data-bind="text: durationOfNegotiation" style="line-height: 0; display: block;"></span>
<span data-bind="text: nameOfPartner" style="line-height: 15px;clear: both; display: block;">asdf</span>
</div></td>
<td>
<div class="metro-bt" data-bind="click: bt_logout_click " id="logout-btn">
<div></div>
<span>Logout</span>
</div></td>
</tr>
</tbody>
</table>
</div>
</section>
<!-- //////////////////////////////////////////////////////
////////// Customer ///////////////
////////////////////////////////////////////////////// -->
<section id="customer-page" data-role="page" data-fullscreen="true">
<header data-role="header">
<h1>Ügyféltörzs</h1>
<a data-role="button" href="#main-page" data-icon="back" data-iconpos="notext" class="ui-btn-left"></a>
</header>
<div class="content" data-role="content">
<div data-enhance="false" data-bind="event: { rowselect: rowselect }" id="customer-jqxGrid" style="margin: 0 auto"></div>
</div>
<div data-role="footer" data-position="fixed" data-tap-toggle="false">
<a href="#add_customer-page" data-icon="plus"> Hozzáad </a>
<a id="b-customer-negotation" class = "ui-disabled" data-icon="star" data-bind="click: startNegotiation"> </a>
<a id="b-customer-modify" class = "ui-disabled" data-icon="edit" data-bind="click: modify"></a>
</div>
</section>
<link rel="stylesheet" href="styles/jqx.base.css" type="text/css" />
<link rel="stylesheet" href="styles/main.css" type="text/css" />
<script type="text/javascript" src="scripts/lib/jquery-1.9.1.min.js"></script>
<script src="scripts/lib/knockout-2.2.1.js"></script>
<script src="scripts/lib/jquery.mobile-1.3.1.min.js"></script>
<script type="text/javascript">
g_loginViewModel = null;
m_tokenKey = "token";
m_serverName = "http://localhost:49670";
$(function() {
$.mobile.ignoreContentEnabled = true;
if (window.localStorage.getItem(m_tokenKey) != null) {
$.mobile.changePage("#main-page");
// bootstrap();
} else {
g_loginViewModel = new LoginViewModel();
ko.applyBindings(g_loginViewModel, document.getElementById("login-page"));
}
});
</script>
</body>
</html>