0
Я пытаюсь закодировать панель, которая закрывает и изменяет текущую страницу после того, как пользователь удаляет ссылку, но ничего не происходит после того, как ссылки будут прослушиваться.Панель, не меняющая страницу в jQuery mobile
Я изначально пытался изменить страницу с помощью тегов (т. Е.) Безрезультатно. Вот мой код:
$("a").on("tap", function(){
switch($(this).attr("id")) {
\t \t case "#woke":
\t \t \t $.mobile.changePage("#woke");
\t \t \t break;
case "#network":
\t \t \t $.mobile.changePage("#network");
\t \t \t break;
}
});
<html lang="en">
\t <head>
\t \t <title>Organize.me</title>
\t \t <meta charset="utf-8">
\t \t <meta name="viewport" content="width=device-width, initial-scale=1.0">
\t \t <link rel="stylesheet" href="main.css" type="text/css"/>
\t \t <link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
\t \t <script src="http://code.jquery.com/jquery-2.2.4.min.js"></script>
\t \t <script src="main.js"></script>
\t \t <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
\t \t
\t </head>
\t
\t <body> \t \t \t \t \t
\t \t <div data-role="page" id="woke">
\t \t \t <!--Navigation panel with links-->
\t \t \t <div data-role="panel" data-dismissible="true" data-swipe-close="true" data-display="overlay" data-fixed-position="true" id="menu">
\t \t \t \t <div data-role="header"> \t \t \t \t \t \t
\t \t \t \t \t \t <h1>Menu</h1> \t
\t \t \t \t \t \t <a href="#network" data-rel="close" class="ui-btn ui-btn-right ui-icon-back ui-btn-icon-left">Back</a>
\t \t \t \t </div> \t \t \t \t
\t \t \t \t <nav><ul data-role="listview" data-inset="true"> \t
\t \t \t \t \t <a href="#woke" class="nav-woke"><li class="buttons">Get Woke</li></a>
\t \t \t \t \t <a href="#network"><li class="buttons">My Network</li></a>
\t \t \t \t \t <a href="#"><li class="buttons">Find Orgs</li></a>
\t \t \t \t \t <a href="#"><li class="buttons">Events</li></a>
\t \t \t \t \t <a href="#"><li class="buttons">Voting</li></a> \t \t \t
\t \t \t \t </ul></nav>
\t \t \t </div>
\t \t \t
\t \t \t <!--Header-->
\t \t \t <div data-role="header">
\t \t \t \t <a href="#menu" data-rel="close" class="ui-btn ui-icon-bars ui-btn-icon-left">Menu</a>
\t \t \t \t <h1>Get Woke</h1>
\t \t \t </div>
\t \t \t
\t \t \t <!--Content-->
\t \t \t <div data-role="content"></div>
\t \t \t
\t \t \t <!--Footer-->
\t \t \t <div data-role="footer">©Scripts of Steele</footer>
\t \t </div>
\t \t
\t \t <div data-role="page" id="network">
\t \t \t <!--Navigation panel with links-->
\t \t \t <div data-role="panel" data-dismissible="true" data-swipe-close="true" data-display="overlay" data-fixed-position="true" id="menu">
\t \t \t \t <div data-role="header">
\t \t \t \t \t \t <a href="#network" data-rel="close" class="ui-btn ui-icon-back ui-btn-icon-left">Back</a>
\t \t \t \t \t \t <h1>Menu</h1> \t \t \t \t
\t \t \t \t </div> \t \t \t \t
\t \t \t \t <nav><ul data-role="listview" data-inset="true"> \t
\t \t \t \t \t <a href="#woke" data-rel="open"><li class="buttons">Get Woke</li></a>
\t \t \t \t \t <a href="#network" data-rel="open"><li class="buttons">My Network</li></a>
\t \t \t \t \t <a href="#"><li class="buttons">Find Orgs</li></a>
\t \t \t \t \t <a href="#"><li class="buttons">Events</li></a>
\t \t \t \t \t <a href="#"><li class="buttons">Voting</li></a> \t \t \t
\t \t \t \t </ul></nav>
\t \t \t </div>
\t \t \t
\t \t \t <!--Header-->
\t \t \t <div data-role="header">
\t \t \t \t <a href="#menu" data-rel="close" class="ui-btn ui-icon-bars ui-btn-icon-left">Menu</a>
\t \t \t \t <h1>My Networks</h1>
\t \t \t </div>
\t \t \t
\t \t \t <!--Content-->
\t \t \t <div data-role="content"></div>
\t \t \t
\t \t \t <!--Footer-->
\t \t \t <div data-role="footer">©Scripts of Steele</footer>
\t \t </div>
\t \t
\t </body>
</html>
Спасибо, но это ничего не изменило для меня –
@AndrewS. что вы пытаетесь изменить? вы получаете сообщения об ошибках в консоли? – user2314737
Я только пытаюсь изменить текущую страницу, которая отображается. В консоли режима разработчика на хроме я не получаю никаких ошибок –