Показать HTML DIV наугад - PullRequest
Новая
       2

Показать HTML DIV наугад

0 голосов
/ 09 октября 2018

Вероятно, это действительно просто, но я не могу заставить этот код работать.Я хотел бы иметь 3 DIV, которые скрыты, если они не были выбраны случайным образом кодом JavaScript.Я посмотрел этот пост, но все еще не мог понять. 

<html onload="load()">   
<body>
<div class="light-grey">

<div id="q1">
div 1
</div>
<div id="q2">
div 2
</div>
<div id="q3">
div 3
</div>

</div>
</body>
<script>

function load(){
randomNumber = Math.floor(Math.random() * 3) + 1   //numbers 1 - 3
     if (randomNumber == 1) {
          document.getElementById("q1").style.display = "inline";
          document.getElementById("q2").style.display = "none";
          document.getElementById("q3").style.display = "none";
     }
     if (randomNumber == 2) {
          document.getElementById("q1").style.display = "none";
          document.getElementById("q2").style.display = "inline";
          document.getElementById("q3").style.display = "none";
     }
     if (randomNumber == 3) {
          document.getElementById("q1").style.display = "none";
          document.getElementById("q2").style.display = "none";
          document.getElementById("q3").style.display = "inline";
     }

}
</script>
</html>

Каждый раз, когда я пробовал, он показывает все 3 DIV одновременно.Это, наверное, что-то действительно очевидное, так как я новичок в JavaScript.Если у вас есть какие-либо вопросы, прокомментируйте ниже.Заранее спасибо.

1 Ответ

0 голосов
/ 09 октября 2018

Атрибут onload был в неправильном теге, он был нужен для тела вместо html 

<body onload="load()">
  <div class="light-grey">

    <div id="q1">
      div 1
    </div>
    <div id="q2">
      div 2
    </div>
    <div id="q3">
      div 3
    </div>

  </div>
</body>
<script>
  function load() {
    randomNumber = Math.floor(Math.random() * 3) + 1 //numbers 1 - 3
    console.log(randomNumber);
    if (randomNumber == 1) {
      document.getElementById("q1").style.display = "inline";
      document.getElementById("q2").style.display = "none";
      document.getElementById("q3").style.display = "none";
    }
    if (randomNumber == 2) {
      document.getElementById("q1").style.display = "none";
      document.getElementById("q2").style.display = "inline";
      document.getElementById("q3").style.display = "none";
    }
    if (randomNumber == 3) {
      document.getElementById("q1").style.display = "none";
      document.getElementById("q2").style.display = "none";
      document.getElementById("q3").style.display = "inline";
    }

  }
</script>

</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...