Metro 风格应用程序中未出现后退按钮

Question

我已按照 MSDN 上的教程进行操作。 html/javascript Metro 风格应用的默认后退按钮不会出现在任何地方。

然后我创建了新项目（网格应用程序、空白应用程序、导航应用程序），即使它是在代码中定义的，它也不会显示。但是，从 Windows 应用商店安装的其他应用程序都显示返回按钮。

还有其他人对后退按钮有这个问题吗？

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>homePage</title>

    <!-- WinJS references -->
    <link href="//Microsoft.WinJS.1.0.RC/css/ui-light.css" rel="stylesheet" />
    <script src="//Microsoft.WinJS.1.0.RC/js/base.js"></script>
    <script src="//Microsoft.WinJS.1.0.RC/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">
            <button class="win-backbutton" aria-label="Back" disabled></button>
            <h1 class="titlearea win-type-ellipsis">
                <span class="pagetitle">Dude!</span>
            </h1>
        </header>
        <section aria-label="Main content" role="main">
            <p>Content goes here.</p>
        </section>
    </div>
</body>
</html>

Answer 1

也许您已经尝试过了，但 HTML 本身是不够的。模板添加的按钮需要 JavaScript 才能启用后退按钮。

默认情况下，按钮添加了 disabled 属性集，但如果脚本确定有要导航回的内容，则会删除该属性。

例如，这里是 Grid 应用模板（在 /js/navigator.js 中）的相关部分：

        // This function updates application controls once a navigation
        // has completed.
        navigated: function () {
            // Do application specific on-navigated work here
            var backButton = this.pageElement.querySelector("header[role=banner] .win-backbutton");
            if (backButton) {
                backButton.onclick = function () { nav.back(); };

                if (nav.canGoBack) {
                    backButton.removeAttribute("disabled");
                } else {
                    backButton.setAttribute("disabled", "disabled");
                }
            }
        },

您可以看到它按类.win-backbutton 查找后退按钮，如果nav.canGoBack 为真，则通过删除禁用来启用后退按钮。 :)