Почему этот код работает только тогда, когда переменные находятся внутри функции? - PullRequest
Новая
       8

Почему этот код работает только тогда, когда переменные находятся внутри функции?

0 голосов
/ 07 мая 2020

Почему эта функция работает только тогда, когда внутри них повторно объявлены переменные? Разве глобальные переменные не должны быть доступны во всем документе? Мой тег скрипта помещен перед окончанием тега body, поэтому я не думаю, что это проблема с загрузкой 

var caixa = document.getElementById('idtxt').value;
var caracteres = caixa.length;
var calculadora = document.getElementsByClassName('contagem');


function algebra(){
  var caixa = document.getElementById('idtxt').value;
  var caracteres = caixa.length;
  var mat = (200 - (caracteres));
  calculadora[0].innerHTML = mat;
}
caixao.addEventListener('keydown',algebra, false );


<!DOCTYPE html>
<html>
  <head>
    <meta name="testenv" content="outro-teste" />
    <link rel="stylesheet" type="text/css" href="css/jstest.css" />
    <title>novo JS</title>
  </head>
  <body>
  <form class="" action="index.html" method="post">
    <label for="idtxt"> Escreva aqui seu texto:</label></br>
    <textarea id = "idtxt" maxlength:"200";></textarea>
    <div class="contagem">
    </div>
  </form>
    <script src="js/jquery-3.5.0.min.js"></script>
    <script type="text/javascript" src="js/jsnv.js"></script>
  </body>
</html>

Ответы [ 2 ]

0 голосов
/ 07 мая 2020

Доступ к переменным не является проблемой. 

var caixa = document.getElementById('idtxt').value;
var caracteres = caixa.length;

Этот код выбирает значение текстового поля и проверяет, сколько символов в этом значении.

Проблема в что в глобальной области эти переменные устанавливаются только при загрузке страницы. Таким образом, в текстовом поле ничего нет, поэтому 0 сохраняется в var caracteres = caixa.length;

Позже срабатывает обработчик keydown, а caracteres по-прежнему равен нулю, потому что вы не проверили текущее значение. текстового поля.

Это работает, когда вы перемещаете значения в функцию, потому что вы выбираете текущее значение текстового поля и проверяете его длину в каждом отдельном keydown событии.

Таким образом, вы можете хранить элементы, которые не будут меняться в глобальной области видимости, но те элементы, которые будут изменяться каждый раз при запуске вашей функции, должны go в области действия функции. 

var idtxt = document.getElementById('idtxt');
var calculadora = document.getElementsByClassName('contagem');

function algebra(){
  var caracteres = idtxt.value.length;
  var mat = (200 - (caracteres));
  calculadora[0].innerHTML = mat;
}

caixao.addEventListener('keydown', algebra, false);
0 голосов
/ 07 мая 2020

Вы снова записываете переменную внутри функции, поэтому вы ее перезаписываете 

var calculadora = document.getElementsByClassName('contagem');

algebra(calculadora);

function algebra(calculadora){
  var caixa = document.getElementById('idtxt').value;
  var caracteres = caixa.length;
  var mat = (200 - (caracteres));
  calculadora[0].innerHTML = mat;
}
caixao.addEventListener('keydown',algebra, false );
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...