Могу ли я избежать сброса html моей переменной javascript при использовании location.href?

Мой новый проект - это небольшая игра-головоломка, в которой вы входите в комнату и решаете головоломку внутри, а затем, когда вы возвращаетесь к разделу выбора уровня, открывается следующий уровень.

До сих пор я использовал единственную переменную «замок» для подсчета один раз каждый раз, когда вы проходите уровень, и если значение «замка» соответствует номеру уровня, он позволит вам пройти.

Проблема в том, что кажется, что когда я использую location.href, он сбрасывает переменную «lock».

HTML для выбора уровня:

//html, link to js and some text
<h1>
<img src="assets/Nextbutton1.png" onclick="t1()" width="100" //1st level button
height="100"> <br>
<img src="assets/Nextbutton2.png" onclick="t2()" width="100" //2nd level button
height="100">

HTML-код экрана Win

<body>
<h1 align="center"> Congratulations</h1>
<button align="center" onclick="joo()">Back to level select</button>

Javascript практически для всего

var lock;
var taso2;  // future stuff
var taso3 = 2; //future stuff

function joo(){

location.href='index.html'
if (lock == 0) // if statement so you dont progress by playing 1st level over and over
{
lock += 1;}
}

function t2() {
if (lock > 0) {
location.href='Taso2.html';
}
else { alert("You have to beat the previous levels first") }
}

function t1() {
location.href='Taso1.html';
}

javascript html var
person Sabishī    schedule 21.08.2019    source источник
comment
Не могли бы вы попробовать использовать файлы cookie?   -  person Zachary McGee    schedule 21.08.2019
comment
При прохождении уровня: localStorage.setItem('lock', lock);. Когда вам нужно определить, к каким уровням у них есть доступ: lock = localStorage.getItem('lock');.   -  person Mordred    schedule 21.08.2019
comment
Можете ли вы передать переменные в качестве параметров запроса (с ?var=foo после расширения .html). Но будьте осторожны, переменные не защищены и могут быть легко изменены.   -  person Monarchis    schedule 21.08.2019
comment
Если вы считаете, что мой ответ правильный, не могли бы вы его принять?   -  person AGoranov    schedule 22.08.2019

Ответы (2)


arrow_upward
3
arrow_downward

HTML по своей природе не имеет памяти. Это означает, что по умолчанию он сбрасывает свои переменные при каждом обновлении страницы. Однако есть способы сохранить ваши переменные. Из w3schools это можно сделать либо с помощью

  • window.localStorage — хранит данные без даты истечения срока действия
  • window.sessionStorage — хранит данные за одну сессию (данные теряются при закрытии вкладки браузера)

Опять же с того же сайта:

// Store
localStorage.setItem("lastname", "Smith");

// Retrieve
document.getElementById("result").innerHTML = localStorage.getItem("lastname");

Обратите внимание, что все это использует ванильный JavaScript, так как вы не указали никаких фреймворков в своем вопросе.

person AGoranov    schedule 21.08.2019
comment
Спасибо, это и то, что я должен был определить блокировку как целое число, наконец заставило систему работать. - person Sabishī; 22.08.2019

arrow_upward
0
arrow_downward

localStorage не только синхронизирует переменную между загрузкой страницы, но и синхронизирует переменную между вкладками.

если вы хотите такое поведение только на одной вкладке браузера, не затрагивая другие вкладки, вы должны использовать sessionStorage вместо localStorage https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage

person rinick    schedule 21.08.2019