Можно ли показать, а затем закрыть текстовый блок только с одной кнопкой, используя JavaScript? - PullRequest
Новая
       0

Можно ли показать, а затем закрыть текстовый блок только с одной кнопкой, используя JavaScript?

0 голосов
/ 24 декабря 2018

Я создал кнопку в HTML и хочу, чтобы она отображалась, а затем скрывала текстовый блок.Можно ли сделать это, используя только одно дно с JavaScript?Я имею в виду, что при нажатии на кнопку текстовый блок должен появиться в <p id="text"></p>, и при повторном нажатии текстовый блок становится скрытым.В моем коде показан только текстовый блок, но он не может быть скрыт.
мой код:

<button type="button" onclick="rulesEnglish()">Rules</button>
<p id="text"></p>

// js: 

function rulesEnglish() {
  document.getElementById('text').innerHTML = 'text block';
}

Ответы [ 2 ]

0 голосов
/ 24 декабря 2018

Если я понял ваш вопрос, вы можете попробовать этот: 

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <title> test</title>
    <script type="text/javascript">
    function rulesEnglish(){
      var pa = document.getElementById("text");
      if (pa.style.display === "none") {
        pa.style.display = "block";
        pa.innerHTML = 'text block';//if you want write a text...
      } else {
        pa.style.display = "none";
      }
    }
    </script>
    </head>
    <body>
    <button type="button" onclick="rulesEnglish()">Rules</button>
    <p id="text">My Text</p>
    
    </body>
    </html>
0 голосов
/ 24 декабря 2018

Переключить (скрыть / показать) элемент 

function rulesEnglish() {
   var x =document.getElementById('text');
  if (x.style.display === "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
}
<button type="button" onclick="rulesEnglish()">Rules</button>

<div id="text" style="display:none">text block</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

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

...