我正在尝试使用 HTML/JS 在 Windows 8.1 中的页面之间导航。 我可以在主屏幕和车辆屏幕之间导航,也可以在主屏幕和零件屏幕之间导航。 我无法从车辆屏幕导航到零件屏幕,反之亦然。 另外,如果我从家到车到家,我无法进入零件屏幕。 我正在使用按钮进行导航...
主页
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Home Page</title>
<!-- WinJS references -->
<script src="//Microsoft.Phone.WinJS.2.1/js/base.js"></script>
<script src="//Microsoft.Phone.WinJS.2.1/js/ui.js"></script>
<link href="/css/default.css" rel="stylesheet" />
<link href="/pages/home/home.css" rel="stylesheet" />
<script src="/pages/home/home.js"></script>
</head>
<body>
<!-- The content that will be loaded and displayed. -->
<div class="fragment homepage">
<header aria-label="Header content" role="banner">
<h1 class="titlearea win-type-ellipsis">
<div class="pagetitle">Vehicle Inventory</div>
</h1>
</header>
<section aria-label="Main content" role="main">
<h3 class="pageDesc">Choose Item to Add/Update/Delete</h3>
<div class="option-btn-home">
<button class="normal-btn-home" id="vehicle-btn">Vehicle</button>
<button class="normal-btn-home" id="part-btn">Part</button>
</div>
</section>
</div>
</body>
</html>
车辆和 PAge 屏幕类似于主页 html。
主页 js:
(function () {
"use strict";
WinJS.UI.Pages.define("/pages/home/home.html", {
ready: function (element, options) {
//navigates to vehicle page
document.getElementById('vehicle-btn').onclick = function (event) {
WinJS.Navigation.navigate("/pages/vehicle/vehicle.html");
}
//navigates to part page
document.getElementById('part-btn').onclick = function (event) {
WinJS.Navigation.navigate("/pages/part/part.html");
}
}
});
})();
车辆屏幕 js:
(function () {
"use strict";
WinJS.UI.Pages.define("/pages/vehicle/vehicle.html", {
ready: function (element, options) {
//navigates to home page
document.getElementById('home-btn').onclick = function (event) {
WinJS.Navigation.navigate("/pages/home/home.html");
}
//navigates to part page
document.getElementById('part-btn').onclick = function (event) {
WinJS.Navigation.navigate("/pages/part/part.html");
}
}
});
})();
部分屏幕 js:
(function () {
"use strict";
WinJS.UI.Pages.define("/pages/part/part.html", {
ready: function (element, options) {
//navigates to home page
document.getElementById('home-btn').onclick = function (event) {
WinJS.Navigation.navigate("/pages/home/home.html");
}
//navigates to vehicle page
document.getElementById('vehicle-btn').onclick = function (event) {
WinJS.Navigation.navigate("/pages/vehicle/vehicle.html");
}
}
});
})();
感谢所有帮助!
所以我修复了它,但我不确定为什么它现在有效。 这是我的新JavaScript代码:
(function () {
"use strict";
WinJS.UI.Pages.define("/pages/home/home.html", {
ready: function (element, options) {
var vehiclebtn = element.querySelector("#vehicle-btn");
vehiclebtn.addEventListener("click", this.toVehicle, false);
var partbtn = element.querySelector("#part-btn");
partbtn.addEventListener("click", this.toPart, false);
},
toVehicle: function(mouseEvent) {
WinJS.Navigation.navigate("/pages/vehicle/vehicle.html");
},
toPart: function(mouseEvent) {
WinJS.Navigation.navigate("/pages/part/part.html");
}
});
})();