заставить кнопку работать по-разному в нечетных и четных кликах - PullRequest
0 голосов
/ 09 октября 2019

Я знаю, что мой вопрос мог задаваться миллионы раз, но я действительно застрял даже после 4 часов исследований;то, что я хотел бы сделать, это заставить функцию onclick над изображением работать по-разному в нечетных и четных щелчках:

<div class= "random button" onclick = "myFunction()"> 
  <img class="cool image"> 
</div> 
<div class = "very cool content"> 
  <p>lorem</p>
</div>

function myFunction () {
 var x = 0;
 if (x - math.floor(x) = 0) {
   document.getElementByClass("very cool content").style.display = "grid";
   var x = x + 0.5;
 } else {
   document.getElementByClass("very cool content").style.display = "none";
   var x = x + 0.5;
 }

Я знаю, что этот вопрос очень глуп, но я абсолютно некомпетентен в javascript, и я нене могу реализовать ни один из ответов, которые я нашел в Интернете, поэтому, пожалуйста, помогите мне.

Ответы [ 2 ]

2 голосов
/ 09 октября 2019

Другим вариантом было бы основание вашей видимости вне класса. И тогда ваша логика может просто переключать этот класс при каждом нажатии.

function myFunction () {
  document.querySelector('.very.cool.content').classList.toggle('visible');
}
.very.cool.content:not(.visible) {
  display: none;
}
<div class= "random button" onclick = "myFunction()"> 
  <img class="cool image" alt="Cool Image"> 
</div> 
<div class = "very cool content"> 
  <p>lorem</p>
</div>
0 голосов
/ 09 октября 2019

Так как Js не сохраняет значение x между двумя щелчками, которое не может работать. Но вы можете определить две характеристики и чередовать их следующим образом:

<html>
<head>
</head>
<body>
<input type="button" onclick = "myFunction()" value="Click me!">  
<div class="content"> 
  <p>lorem</p>
</div>
<script>
function myFunction () {
    let even = 'grid';
    let odd = 'none';
    let elements = document.getElementsByClassName("content")

    Array.prototype.forEach.call(elements, function(element) {
        element.style.display === even ? element.style.display = odd : element.style.display = even
    });
}
</script>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...