OnsenUIのナビゲーション型機能を作りたいのですが、page1.htmlからpage2.htmlへのページ遷移ができません。
初心の事だとは思いますが教えていただければ幸いです。
index.html
<html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta http-equiv="Content-Security-Policy" content="default-src * data: gap: https://ssl.gstatic.com; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> <script src="components/loader.js"></script> <script src="lib/onsenui/js/onsenui.min.js"></script> <link rel="stylesheet" href="components/loader.css"> <link rel="stylesheet" href="lib/onsenui/css/onsenui.css"> <link rel="stylesheet" href="lib/onsenui/css/onsen-css-components.css"> <link rel="stylesheet" href="css/style.css"> </head> <body> <ons-navigator id="navigator" page="page1.html"></ons-navigator> </body> </html>
page1.html
<ons-page id="first-page"> <ons-toolbar> <div class="center">Page 1</div> </ons-toolbar> <div class="content" style="text-align: center"> <p>This is the first page.</p> <ons-button onclick="navigator.pushPage('page2.html')">Push page</ons-button> </div> </ons-page>
page2.html
<ons-page id="second-page"> <ons-toolbar> <div class="left"><ons-back-button>Page 1</ons-back-button></div> <div class="center">Page 2</div> </ons-toolbar> <div class="content" style="text-align: center"> <p>This is the second page.</p> <ons-button onclick="navigator.popPage()">Pop page</ons-button> </div> </ons-page>
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/03/07 14:54