Почему код не скрывает html div, когда аргумент (false) введен в функцию winOrNot? - PullRequest
0 голосов
/ 06 мая 2018

Почему этот код не скрывает сообщение "Поздравления" в div, когда функция вызывается с аргументом (false)?

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<div id="winner">Congratulations!</div>
<script>
var winner = function winOrNot(winner) {
//if the variable winner has the value of true, show the div with id "winner"
if(winner) {
    document.getElementById('winner');
}
//otherwise, hide the div if the value of winner is false
else {
    document.getElementById('winner').style.display = 'none';
}

winOrNot(false);
}
</script>
</body>
</html>

ОБНОВЛЕНИЕ: Спасибо за ваши предложения. Я обновил мой код с вашими идеями, но я все равно получаю тот же результат после сохранения изменений и запуска кода. Вот ревизия:

<!DOCTYPE html>
<html>
<head>
    <title></title>
<style>
    #winner {
        display:block;
    }
</style>
</head>
<body>
<div id="winner">Congratulations!</div>
<script>
var winner = function winner(winner) {
//if the variable winner has the value of true, show the div with id "winner"
    if(winner) {
    document.getElementById('winner');
}
//otherwise, hide the div if the value of winner is false
    if(winner===false) {
    document.getElementById('winner').style.display = 'none';
}

}
winner(false);
</script>
</body>
</html>

Ответы [ 5 ]

0 голосов
/ 06 мая 2018

Ваша функция winOrNot не была запущена! Теперь давайте рассмотрим ваши сценарии

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<div>you can c</div>
<div id="winner">Congratulations!</div>
<script>
var winner = function winOrNot(winner) {
  // if the variable winner has the value of true, show the div with id "winner"
  if(winner) {
    document.getElementById('winner');
  } else {
    document.getElementById('winner').style.display = 'none';
  }
}
winner(false);
</script>
</body>
</html>

Нет выполнения около winOrNot. Вы помещаете winOrNot(false) в саму функцию. Может быть, положить его снаружи, чтобы увидеть, что вы хотите.

И функция winOrNot не определена, когда вы вызываете снаружи, поэтому вы должны вызвать winner.

Еще одна вещь, вы создали рекурсивную функцию и бесконечную рекурсию, что есть единственная ситуация, когда стек больше чем максимальный стек.

0 голосов
/ 06 мая 2018

нужно вызвать функцию winOrNot. ваша функция call (winOrNot(false)) была внутри объявления winOrNot.

Кроме того, чтобы изменить состояние обратно с display: none, нам нужно установить display: block для элемента, который мы спрятали.

winOrNot(false);

setTimeout(() => winOrNot(true), 2000);

function winOrNot(winner) {
  //if the variable winner has the value of true, show the div with id "winner"
  if (winner) {
    document.getElementById('winner').style.display = 'block';
  }
  //otherwise, hide the div if the value of winner is false
  else {
    document.getElementById('winner').style.display = 'none';
  }
}
<h5>should change after 5 seconds</h5>

<div id="winner">Congratulations!</div>
0 голосов
/ 06 мая 2018

Сначала, если вы пытаетесь вызвать эту функцию, вызовите ее с помощью winner(), потому что именно здесь вы сохраняете ссылку на эту функцию.

Во-вторых, вы не называете это в своем сценарии.

Вы должны сделать это вне тела функции. И если вы пытаетесь указать имя функции в выражении функции, тогда имя будет доступно только внутри тела функции. (в случае, если вам нужно делать рекурсивные вызовы.) Но если вам не нужно ничего подобного, создайте анонимную функцию или именованную функцию. Итак, вы можете назвать это просто,

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<div id="winner">Congratulations!</div>
<script>
var winner = function winOrNot(winner) {
//if the variable winner has the value of true, show the div with id "winner"
if(winner) {
    document.getElementById('winner');
}
//otherwise, hide the div if the value of winner is false
else {
    document.getElementById('winner').style.display = 'none';
}


}
winner(false);
</script>
</body>
</html>
0 голосов
/ 06 мая 2018

var winner = function winOrNot(winner) {
//if the variable winner has the value of true, show the div with id "winner"
if(winner) {
    document.getElementById('winner');
}
//otherwise, hide the div if the value of winner is false
else {
    document.getElementById('winner').style.display = 'none';
}
}

  setTimeout(function(){ winner(false);}, 3000);
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<div id="winner">Congratulations!</div>
<script>

</script>
</body>
</html>
0 голосов
/ 06 мая 2018

Вы должны звонить winner(winner), а не winOrNot(winner). Также переместите вызов winner(false) вне определения функции (лучший отступ кода помогает выявить такие проблемы).

var winner = function winOrNot(winner) {
//if the variable winner has the value of true, show the div with id "winner"
if(winner) {
    document.getElementById('winner');
}
//otherwise, hide the div if the value of winner is false
else {
    document.getElementById('winner').style.display = 'none';
}
}

winner(false);
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<div id="winner">Congratulations!</div>
<script>

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