首页jquery mobile 使用button标签跳转界面

jquery mobile 使用button标签跳转界面

时间: 2023-09-17 21:11:10 浏览: 132

您可以使用以下代码来实现在 jQuery Mobile 中使用 button 标签进行页面跳转： ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>jQuery Mobile Button跳转页面</title> <link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"> <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script> <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> </head> <body> <div data-role="page" id="page1"> <div data-role="header"> <h1>页面1</h1> </div> <div data-role="content"> <a href="#page2" data-role="button">跳转到页面2</a> </div> </div> <div data-role="page" id="page2"> <div data-role="header"> <h1>页面2</h1> </div> <div data-role="content"> <a href="#page1" data-role="button">返回页面1</a> </div> </div> <script> $(document).on("pagecreate", function() { $.mobile.defaultPageTransition = "slide"; }); </script> </body> </html> ``` 在上面的示例代码中，我们使用了 jQuery Mobile 的 `data-role="button"` 属性来创建按钮，并使用 `href` 属性指定了要跳转的页面的 ID。通过点击按钮，可以实现页面之间的跳转。注意，我们还在 `<script>` 标签中设置了页面切换的动画效果为滑动（`slide`）。您可以根据需要自定义页面切换效果。希望这可以帮助到您！如有其他问题，请随时提问。

阅读全文