#javascript #html
#javascript #HTML
Вопрос:
У меня есть эта функция, которая предупреждает пользователя, когда их количество «лунного камня» равно 10. Однако по разным причинам я бы хотел, чтобы оператор if находился вне функции. Однако, когда я это делаю, предупреждение не работает. Не мог бы кто-нибудь объяснить и опубликовать исправление для этого?
<!DOCTYPE html>
<html>
<img id="game-board" onclick="totalCount()" class="game-board" src="https://pics.clipartpng.com/thumbs/Mars_PNG_Clip_Art-3002.png"></img>
<h2 id="counts">Moonstone:</h2>
<script>
let stone = 0;
function totalCount() {
let newCounts = stone ;
document.getElementById('counts').innerHTML= "Moonstone:" newCounts;
}
if (newCounts == 10){
alert('10');
}
</script>
</html>
Что работает, но я не хочу использовать, это
<DOCTYPE html>
<html>
<img id="game-board" onclick="totalCount()" class="game-board" src="https://pics.clipartpng.com/thumbs/Mars_PNG_Clip_Art-3002.png"></img>
<h2 id="counts">Moonstone:</h2>
<script>
let stone = 0;
function totalCount() {
let newCounts = stone ;
document.getElementById('counts').innerHTML= "Moonstone:" newCounts;
if (newCounts == 10){
alert('10');
}
}
</script>
Комментарии:
1. вам нужно посмотреть на область видимости
2. Это «не работает», потому что (1) вы пытаетесь использовать переменную вне функции, в которой она определена, и (2) вы пытаетесь использовать ее только один раз сразу после загрузки страницы, прежде чем она когда-либо получит искомое значение. Если у вас уже есть рабочая версия, в чем проблема? Почему вы не хотите использовать рабочий код?
Ответ №1:
В вашем коде вы вызываете функцию totalcount() при событии onclick, поэтому все, что находится внутри функции totalcount(), будет выполнено, а код вне функции totalcount() выполняться не будет
Ответ №2:
Я не совсем понимаю, почему вам не нужен тест if внутри функции. Но есть кое-что, что вы могли бы сделать:
const counter = {
value: 0,
addOne: function() {
this.value ;
if (this.value > 10) {
alert("Too many");
this.value--;
} else {
document.getElementById("counts").innerHTML = "Moonstones: " this.value;
}
}
}
function updateCounter() {
counter.addOne();
} <button onclick="updateCounter();">Add</button>
<div id="counts"></div> Это создает счетчик как объект и включает в себя тест if для функции addOne, непосредственно прикрепленной к этому объекту. Всякий раз, когда вызывается функция updateCounter(), функция addOne обновляет значение счетчика и проверяет, прошло ли оно 10. Если это так, пользователь получает и оповещение, в противном случае элемент «counts» обновляется.
Но, как говорили другие, нет реальной причины, по которой тест if не должен быть частью функции — возможно, вы могли бы объяснить свои причины этого требования?
Комментарии:
1. Причина, по которой мне это нужно отдельно, заключается в том, что показанный код является небольшой частью игры, которую я создаю. По сути, пользователь открывает новые планеты своим «лунным камнем». Однако для этого мне нужна функция, которая проверяет значение переменной stone и предупреждает пользователя, может ли он купить планету или нет. Проблема в том, что, поскольку переменная stone и счетчик находятся в функции, когда я проверяю их значения в новой функции, чтобы отправить оповещения и вычесть необходимый камень у пользователя, это не работает.
2. Переменные определены в функции, потому что именно там они были определены. Вы можете определить переменные вне функции и обновить их внутри функции. Поскольку они находятся вне функции, они являются «глобальными» и их можно увидеть из любой другой функции. Итак, введите «let newCounts;» над функцией и удалите «let» из «let newCounts = stone ;» внутри функции. Затем newCounts становится видимым для других функций