Question

所以这就是我的想法：我在我的工作室的网站上编程，但只是在一个页面中。当你点击一个按钮继续...例如，＆＃34;原因为什么＆＃34;页面，您不是重定向，但页面内容更改！基本上代码非常简单，像这样的东西：

＆＃13;

function soloprenota() {
  document.getElementById("article1").style.display = "block";
  document.getElementById("article2").style.display = "none";
  document.getElementById("article3").style.display = "none";
}

function soloilnostrosuono() {
  document.getElementById("article1").style.display = "none";
  document.getElementById("article2").style.display = "block";
  document.getElementById("article3").style.display = "none";
}

function soloreasonwhy() {
  document.getElementById("article1").style.display = "none";
  document.getElementById("article2").style.display = "none";
  document.getElementById("article3").style.display = "block";
}

＆＃13;

当您单击导航栏上的相关按钮时，将调用函数，并且所有操作都将如何工作。当我意识到，在fisrt时，当页面加载时，用户没有给出预期的操作，因此似乎没有办法告诉JavaScript设置其中一个div＆＃34; dafault＆＃34;

我已经尝试了几种方式，最常见的可能就是这个：

＆＃13;

if (jQuery.isDefined(soloprenota) || jQuery.isDefined(soloilnostrosuono) jQuery.isDefined(soloreasonwhy)) {
  var examplevar = "examplevaluerlyididntknowwhattomakeitdoesincaseofthis";
} else {
  document.getElementById("article1").style.display = "block";
  document.getElementById("article2").style.display = "none";
  document.getElementById("article3").style.display = "none";
}

＆＃13;

但永远不会改变，在第一个加载页面仍然显示所有div。我该怎么做才能解决这个问题？：/

Answer 1

只需添加soloprenota();作为<script>的最后一行。这将使 soloprenota 成为默认值。

检查以下示例。

function soloprenota() {
  document.getElementById("article1").style.display = "block";
  document.getElementById("article2").style.display = "none";
  document.getElementById("article3").style.display = "none";
}

function soloilnostrosuono() {
  document.getElementById("article1").style.display = "none";
  document.getElementById("article2").style.display = "block";
  document.getElementById("article3").style.display = "none";
}

function soloreasonwhy() {
  document.getElementById("article1").style.display = "none";
  document.getElementById("article2").style.display = "none";
  document.getElementById("article3").style.display = "block";
}

soloprenota();

<nav>
  <ul>
    <li onclick="soloprenota()">soloprenota</li>
    <li onclick="soloilnostrosuono()">soloilnostrosuono</li>
    <li onclick="soloreasonwhy()">soloprenota</li>
    </ul>
  </nav>
<div id="article1">article 1</div>
<div id="article2">article 2</div>
<div id="article3">article 3</div>

Answer 2

使用此短代码来使用此脚本并根据需要显示。

function soloprenota(e) {
  var detectid = e;
  if(detectid=="article1"){
  document.getElementById("article1").style.display = "block";
  document.getElementById("article2").style.display = "none";
  document.getElementById("article3").style.display = "none";
  } else if(detectid=="article2"){
  document.getElementById("article2").style.display = "block";
  document.getElementById("article1").style.display = "none";
  document.getElementById("article3").style.display = "none";
  } else if(detectid=="article3"){
  document.getElementById("article3").style.display = "block";
  document.getElementById("article1").style.display = "none";
  document.getElementById("article2").style.display = "none";
  }
}

//Style Sheet
#article1 {
    display:none;
}
#article2 {
    display:none;
}
#article3 {
    display:none;
}

<nav>
  <ul>
    <li onclick="soloprenota('article1')">soloprenota</li>
    <li onclick="soloilnostrosuono('article2')">soloilnostrosuono</li>
    <li onclick="soloreasonwhy('article3')">soloprenota</li>
    </ul>
  </nav>
<div id="article1">article 1</div>
<div id="article2">article 2</div>
<div id="article3">article 3</div>

Answer 3

<nav>
    <ul>
        <li onclick="soloprenota()">soloprenota</li>
        <li onclick="soloilnostrosuono()">soloilnostrosuono</li>
        <li onclick="soloreasonwhy()">soloprenota</li>
    </ul>
</nav>
<div id="article1">article 1</div>
<div id="article2">article 2</div>
<div id="article3">article 3</div>

的style.display =＆＃34;块＆＃34;仅限于默认div不会在页面打开时起作用

3 个答案: