1
Ich habe ein einfaches zweiseitiges Beispiel erstellt, die erste Seite hat eine Listenansicht und die zweite nur eine <h1>, aber wenn die zweite Seite geladen wird, werden nun ui Stile angewendet es automatisch? Muss ich etwas manuell anrufen oder gibt es ein Problem mit der Navigation? Code unter jeder Hilfe sehr geschätzt.Unstyled (keine Klassen angewendet) Seiten jQuery Mobile Einfache Navigation
index.html
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<title>Page One</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>
</head>
<body>
<div data-role="page" data-theme="a" id="second">
<div data-role="header">
<h1 id="logo" class="ui-title">Header</h1>
</div>
<div data-role="content">
<ul data-role="listview" data-inset="true" data-theme="c" data-split-theme="d">
<li class="ui-li-has-thumb">
<img class="ui-li-thumb" src="http://jquerymobile.com/demos/1.0a2/docs/lists/images/album-bb.jpg" />
<h3 class="ui-li-heading">FooBar</h3>
<p class="ui-li-desc">Progress</p>
<a href="second.html"></a>
</li>
<li class="ui-li-has-thumb">
<img class="ui-li-thumb" src="http://jquerymobile.com/demos/1.0a2/docs/lists/images/album-bb.jpg" />
<h3 class="ui-li-heading">FooBar</h3>
<p class="ui-li-desc">Progress</p>
<a href="second.html"></a>
</li>
</ul>
</div>
<div data-role="footer" data-position="fixed">
<div data-role="navbar" class="ui-glyphish">
<ul>
<li><a class="ui-btn-active" id="quickfind" href="index.html" data-icon="custom">QuickFind</a></li>
<li><a id="lessons" href="lessons.html&ui-page=listview-1" data-icon="custom" data-theme="a">Lessons</a></li>
<li><a id="progress" href="#" data-icon="custom" data-theme="a">Progress</a></li>
<li><a id="favs" href="#" data-icon="custom" data-theme="a">Favs</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>
second.html
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<title>Page Two</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1 id="logo" class="ui-title">Second</h1>
</div>
<div data-role="content">
<h1>Hello Page Two</h1>
</div>
<div data-role="footer" data-position="fixed">
<div data-role="navbar" class="ui-glyphish">
<ul>
<li><a class="ui-btn-active" id="quickfind" href="index.html" data-icon="custom">QuickFind</a></li>
<li><a id="lessons" href="lessons.html&ui-page=listview-1" data-icon="custom" data-theme="a">Lessons</a></li>
<li><a id="progress" href="#" data-icon="custom" data-theme="a">Progress</a></li>
<li><a id="favs" href="#" data-icon="custom" data-theme="a">Favs</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>
das Problem behoben ist, wenn die Seite der eingeführt wird. Die Funktion page() wird nicht aufgerufen, um den neuen Inhalt als Seite zu initiieren ... – Gcoop
Sind Sie sicher, dass Ihre Frage richtig ist? "Es gibt jetzt ui Styles darauf angewendet". Meinst du "es gibt KEINE ui Stile, die darauf angewendet werden"? – Marc