2

MSDN のチュートリアルに従いました。html/javascript メトロ スタイル アプリのデフォルトの戻るボタンはどこにも表示されません。

次に、新しいプロジェクト (グリッド アプリ、空のアプリ、ナビゲーション アプリ) を作成しましたが、コードで定義されていても表示されません。ただし、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>
4

1 に答える 1

5

すでにこれを試したことがあるかもしれませんが、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クラスごとに戻るボタンを検索し、true の場合nav.canGoBackは、無効化を削除して戻るボタンを有効にしていることがわかります。:)

于 2012-08-17T19:08:57.633 に答える