在页面之间导航时遇到问题 窗口 8.1- javascript



我正在尝试使用 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");
    }
});    
})();

相关内容

  • 没有找到相关文章

最新更新