Переназначить переменную со случайным числом при выполнении условия (ванильный Javascript)
Я хотел бы знать, как сгенерировать новое случайное число после выполнения условия оператора if. Как только длина массива достигнет 3, переназначьте переменной randomNumber новое число. На данный момент я не вижу никаких изменений, когда переменная randomNumber регистрируется в консоли и выполняется условие, число не меняется без обновления страницы.
let randomNumber = Math.floor(Math.random() * 100);
console.info(randomNumber);
const numberArr = [];
const form1 = document.getElementById("form1");
if (numberArr.length === 3) {
numberArr.splice(0, 3);
randomNumber = Math.floor(Math.random() * 100);
};
form1.addEventListener("submit", e => {
const values = document.getElementsByName("number")[0].value;
numberArr.push(values);
e.preventDefault();
form1.reset();
}); <form id = "form1">
<div class = "row w-100 d-flex justify-content-between div1">
<div class = "col-12 d-flex justify-content-center">
<input type = "number" name = "number" id = "number" min = "1" max = "100">
</div>
<div class = "col-12 d-flex justify-content-center">
<button type = "submit" form = "form1" id = "sub1">Submit</button>
</div>
</div>
</form>
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 3
написанный вами код проверяет, есть ли в массиве 3 элемента в загрузка страницы, что никогда не бывает, и не повторяется позже. Итак, чтобы исправить это, просто поместите оператор if в прослушиватель событий, и он должен работать так, как вы ожидали.
let randomNumber = Math.floor(Math.random() * 100);
console.info(randomNumber);
const numberArr = [];
const form1 = document.getElementById("form1");
form1.addEventListener("submit", e => {
const values = document.getElementsByName("number")[0].value;
numberArr.push(values);
e.preventDefault();
if (numberArr.length === 3) {
numberArr.splice(0, 3);
randomNumber = Math.floor(Math.random() * 100);
console.info(randomNumber);
};
form1.reset();
});<form id = "form1">
<div class = "row w-100 d-flex justify-content-between div1">
<div class = "col-12 d-flex justify-content-center">
<input type = "number" name = "number" id = "number" min = "1" max = "100">
</div>
<div class = "col-12 d-flex justify-content-center">
<button type = "submit" form = "form1" id = "sub1">Submit</button>
</div>
</div>
</form>обновил код не могли бы вы проверить?
Похоже, он генерирует новое случайное число, но можно ли снова использовать это число в моем коде? Если я возьму исходную переменную и использую ее снова, она будет отображаться как измененная? это может не иметь никакого смысла извините
да, это можно снова использовать в вашем коде
Это был глупый вопрос, который я уже задавал в своем другом коде, я просто упростил его, когда писал здесь. Спасибо
Это связано с тем, что вы проверяете условие не каждый раз, когда пользователь отправляет форму, а только один раз в области действия страницы (при загрузке страницы).
let randomNumber = Math.floor(Math.random() * 100);
console.info(randomNumber);
const numberArr = [];
const form1 = document.getElementById("form1");
form1.addEventListener("submit", e => {
e.preventDefault();
const values = document.getElementsByName("number")[0].value;
numberArr.push(values);
form1.reset();
if (numberArr.length === 3) {
numberArr.splice(0, 3);
randomNumber = Math.floor(Math.random() * 100);
console.info(randomNumber);
}
}); <form id = "form1">
<div class = "row w-100 d-flex justify-content-between div1">
<div class = "col-12 d-flex justify-content-center">
<input type = "number" name = "number" id = "number" min = "1" max = "100">
</div>
<div class = "col-12 d-flex justify-content-center">
<button type = "submit" form = "form1" id = "sub1">Submit</button>
</div>
</div>
</form>Кроме того, numberArr не имеет смысла в этом коде, потому что вы можете использовать простой счетчик и увеличивать его на 1 каждый раз, когда форма отправляется, и сбрасывать его после
условие выполнено.
Извините, ваш действительно работал. Это была моя ошибка. На самом деле я уже сделал это в своем коде, прежде чем упростить его, чтобы добавить его в stackoverflow, но я не учитывал область, когда добавлял его здесь.
Проверяйте в функции обработчика (так: каждый раз, когда нажимается кнопка). Вот упрощенный фрагмент с использованием делегация мероприятия.
document.addEventListener(`click`, handle);
let randomNumber = Math.floor(Math.random() * 100);
console.info(`initial ${randomNumber}`);
let numberArr = [];
function handle(evt) {
if (evt.target.id === `sub1`) {
numberArr.push(+document.querySelector(`#number`).value ?? 0);
const len = numberArr.length;
if (numberArr.length === 3) {
randomNumber = Math.floor(Math.random() * 100);
numberArr = [];
}
return console.info(randomNumber);
}
}<div class = "row w-100 d-flex justify-content-between div1">
<div class = "col-12 d-flex justify-content-center">
<input type = "number" name = "number" id = "number" min = "1" max = "100">
</div>
<div class = "col-12 d-flex justify-content-center">
<button type = "submit" form = "form1" id = "sub1">Submit</button>
</div>
</div>
Спасибо, но это не переназначает исходную переменную с новым случайным числом