Question

我想在我的html页面上默认显示内容1但是当我点击h2时它会显示内容2 如果我再次点击h1，它将隐藏内容2并显示内容1.我试图隐藏

$(function () {
    $("#content2").hide(); 
});

但是当我点击h2时它没有显示任何内容。我使用了这段代码

h1.onclick = function () {
            WinJS.UI.Animation.exitContent(content2 , { top: "0px", left: "350px" })
                .then(function () { return WinJS.Promise.timeout(200); })
                .done(function () { WinJS.UI.Animation.enterContent(content1, { top: "0px", left: "350px" }); 
h2.onclick = function () {
            WinJS.UI.Animation.exitContent(content1, { top: "0px", left: "350px" })
            .then(function () { return WinJS.Promise.timeout(1000); })
                .done(function () { WinJS.UI.Animation.enterContent(content1, { top: "0px", left: "350px" }); });
        };

Answer 1

看看这个并查看它是否有帮助... h1（我的代码中content1）显示为可见，当你点击它时，＆＃34;它消失了＃34;并显示content2

HTML

<div id="content1">
    <p>This is content 1</p>
</div>
<div id="content2">
    <p>This is content 2</p>
</div>

Javascript

content2.style.opacity = "0";

content1.onclick = function () {
    WinJS.UI.Animation.exitContent(content1, { top: "0px", left: "350px" }).then(
        function () {
            return WinJS.Promise.timeout(200);
        })
        .done(function () {
            WinJS.UI.Animation.enterContent(content2, { top: "0px", left: "350px" });
        })
}

content2.onclick = function () {
    WinJS.UI.Animation.exitContent(content2, { top: "0px", left: "350px" }).then(
        function () {
            return WinJS.Promise.timeout(200);
        })
        .done(function () {
            WinJS.UI.Animation.enterContent(content1, { top: "0px", left: "350px" });
        });
};

如何在默认的html页面上通过winJS.UI隐藏特定内容

1 个答案: