Question

我有一个代码，当在网址的最后一部分输入“？a ='输入div number'”代码时显示隐藏的div。

<html>
<title> </title>
<head> 
</head>

<body>
<div id="tab1" style="display:none" > 
<p> "This is div 1" </p>
</div>

<div id="tab2" style="display:none"> 
<p> "This is div 2" </p>
    </div>

        <div id="tab3" style="display:none">
        <p> "This is div 3" </p>
        </div>
    </body> 
<script type="text/javascript">

if (window.location == 'http://localhost/assignment.html'){
document.getElementById("tab1").style.display="block";
}

if (window.location == 'http://localhost/assignment.html?a=2'){
document.getElementById("tab2").style.display="block";
}

if (window.location == 'http://localhost/assignment.html?a=3'){
document.getElementById("tab3").style.display="block";
}else{
document.getElementById("tab1").style.display="block";
}



</script>


</html>

当我输入http://localhost/assignment.html?a=2时，结果会给出“这是div1”和“这是div2”

Answer 1

您的上一个else语句仅适用于您的上一个if语句，因此在tab1时a != 3 总是显示。我认为您打算使用else if：

if (window.location == 'http://localhost/assignment.html') {
    document.getElementById("tab1").style.display = "block";
} else if (window.location == 'http://localhost/assignment.html?a=2') {
    document.getElementById("tab2").style.display = "block";
} else if (window.location == 'http://localhost/assignment.html?a=3') {
    document.getElementById("tab3").style.display = "block";
} else {
    document.getElementById("tab1").style.display = "block";
}

Answer 2

if (window.location == 'http://localhost/assignment.html?a=3'){
   document.getElementById("tab3").style.display="block";
}else{ // Problem is in this else statment
   document.getElementById("tab1").style.display="block";
}

在此部分代码中，您检查位置是否不是http://localhost/assignment.html?a=3显示'tab1' div。您可以删除此部分（来自else）。

JS使用url显示div

2 个答案: