Question

我想显示我的HTML页面的1个部分并隐藏其余部分。我还创建了一个＆＃34; next＆＃34;按钮和＆＃34;之前的＆＃34;按钮滚动浏览一堆。但该网站似乎并未受此影响。

 next1 = function () {

    if ($("#p1").css("display") !== "none") {
        $("#p2").show()
        $("#p1").hide()
        $("#p3").hide()
    } 

    else if ($("#p2").css("display") !== "none") {
        $("#p3").show()
        $("#p1").hide()
        $("#p2").hide()
    }

    else if ($("#p3").css("display") !== "none")) {
        alert("This is the end.")
     }

}

prior = function () {
    if ($("#p1").css("display") !== "none")) {
        alert("No pages before this.")
        }

    else if ($("#p2").css("display") !== "none")) {
        $("#p1").show()
        $("#p2").hide()
        $("#p3").hide()
    }

    else if ($("#p3").css("display") !== "none")) {
        $("#p2").show()
        $("#p1").hide()
        $("#p3").hide()
    } 

}

setup = function () {
    $("#p2").css("display") == "none")
    $("#p3").css("display") == "none")
    $("#next1").click(next)
    $("#prior").click(prior)

}
$(document).ready(setup)

和HTML

<!DOCTYPE html>

<head>

<script src="page.js"></script>
<title>A Story</title>
</head>
<body>


<section id="p1">
<p>...4</p>
</section>

<section id="p2">
<p>..2.</p>
</section>

<section id="p3">
<p>..1.</p>
</section>


<button value="prior">previous</button>    <button value="next">next</button>


</body>
</html>

Answer 1

我认为问题出在你的if语句中。

if ($("#p1").css('display') !== 'none') {
    $("#p2").show()
    $("#p1").hide()
    $("#p3").hide()
}

if（$（“＃p1”）。show（））{...因为show是函数而不是对象的属性而无法工作

normaly jquery使用display none来隐藏dom元素

顺便说一下，你忘了在发布的代码中加载jquery。

下一个问题是。在浏览器构建dom之前，您的脚本可用。在body标签后面设置脚本标签。

请仔细查看jquery文档，看看$（document）.ready（）的作用以及为什么所有人都使用它。

如何隐藏一个陈述并揭示另一个陈述？

1 个答案: