Question

如何在一个HTML页面上拥有更多不同的页面？但是一次只看一页？例如，我有两个不同的段落：新闻和联系 - 我如何才能看到只有新闻，然后点击按钮查看联系人并隐藏新闻？

Answer 1

所以你基本上所要做的就是将所有段落包装成不同的div标签，然后点击一个按钮，我们将隐藏一个部分（在本例中为新闻部分）并显示另一部分（在我们的案例中联系）然后一次又一次地结束。在这种情况下，我们需要jQuery，我们也可以在没有jQuery的情况下执行此操作但是使用它更容易。您可以查看这个JSFiddle演示：https://jsfiddle.net/Ejdrien/hme5bsw7/1/

<强> HTML

<div id="news">
    <h1>News</h1>
    <p>This is content of News section!</p>
    <button id="newsButton">Click me to show Contact section!</button>
</div>

<div id="contact">
    <h1>Contact</h1>
    <p>This is content of contact section!</p>
    <button id="contactButton">Click me to show News section!</button>
</div>

<强> JS

$(document).ready(function() {
    //This hides contact section while documents loads
    $("#contact").hide();
    $("#contactButton").hide();
    //When you newsButton it'll hide news and show contact
    $("#newsButton").on("click", function() {
        //Hides news section
        $("#news").hide();
        $("#newsButton").hide();
        //Shows contact section
        $("#contact").show();
        $("#contactButton").show();
    });
    //When you contactButton it'll hide contact and show news
    $("#contactButton").on("click", function() {
        //Shows News section
        $("#news").show();
        $("#newsButton").show();
        //Hides contact section
        $("#contact").hide();
        $("#contactButton").hide();
    });
});

Answer 2

这可以使用Bootstrap accordion

来完成

Answer 3

您可以创建两个段落并隐藏一个段落（第一段）。使用JavaScript，在按钮事件中创建要更改的事件。

Answer 4

使用Javascript在exp(returnop$yi)中切换let token; let tokenPromise = new Promise(function(resolve, reject) { fetch(tokenUrl, options) .then(res => { if (res.ok) { return res.json() } else { reject('Not clean') } }).then((data) => { resolve(data.access_token) }) }) token = tokenPromise.then(res => {return res}) return token和display: none。

display: block

div

$(document).ready(function() {
    $(".tabs-menu a").click(function(event) {
        event.preventDefault();
        $(this).parent().addClass("current");
        $(this).parent().siblings().removeClass("current");
        var tab = $(this).attr("href");
        $(".tab-content").not(tab).css("display", "none");
        $(tab).fadeIn();
    });
    
    $("#contact").css("display", "none");
});

我怎样才能更多＆＃34;页面＆＃34;一页？

4 个答案: