Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.04.2020, 22:29
MOT MOT вне форума
Аспирант
Отправить личное сообщение для MOT Посмотреть профиль Найти все сообщения от MOT
 
Регистрация: 30.08.2019
Сообщений: 52

Хранение данных в кеше
Всем привет, написал небольшой код голосования:
<style>
#quiz {
width: 200px;
height: 200px;
border: 1px solid black;
}
.result1, .result2, .result3, .result4 {
display: none;
position: relative;
color: #216558;
}
#quiz > #answer1:checked + .span_result1 > .result1 {
display: block;
bottom: -120px;
}
#quiz > #answer2:checked + .span_result2 > .result2 {
display: block;
bottom: -100px;
}
#quiz > #answer3:checked + .span_result3 > .result3 {
display: block;
bottom: -80px;
}
#quiz > #answer4:checked + .span_result4 > .result4 {
display: block;
bottom: -60px;
}
</style>
<form id="quiz">
    <b><i>Как вы произносите название "JavaScript"?</i></b><br>
    <input type="radio" name="quiz" id="answer1"><span class="span_result1">ДжаваСкрипт<div class="result1">Вы выбрали "ДжаваСкрипт"</div></span><br>
    <input type="radio" name="quiz" id="answer2"><span class="span_result2">ЯваСкипт<div class="result2">Вы выбрали "ЯваСкрипт"</div></span><br>
    <input type="radio" name="quiz" id="answer3"><span class="span_result3">ДжабаСкрипт<div class="result3">Вы выбрали "ДжабаСкрипт"</div></span><br>
    <input type="radio" name="quiz" id="answer4"><span class="span_result4">ЕваСкрипт<div class="result4">Вы выбрали "ЕваСкрипт"</div></span>
</form>

Вопрос: как закешировать данные на js так, чтобы при релоаде не сливалось значение radio и нельзя было изменить положение этого самого radio (желательно без БД)
P.S.Кто помнит Ева'Скрипт?

Последний раз редактировалось MOT, 12.04.2020 в 22:32.
Ответить с цитированием
  #2 (permalink)  
Старый 12.04.2020, 22:55
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

MOT,
искать по форуму примеры с localStorage и начните писать код.
метка есть в localStorage ставим значение, отключаем выбор иначе ставим обработку выбора
Ответить с цитированием
  #3 (permalink)  
Старый 12.04.2020, 23:59
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

localStorage сохранение выбора
MOT,
<style>
#quiz {
width: 200px;
height: 200px;
border: 1px solid black;
}
.result1, .result2, .result3, .result4 {
display: none;
position: relative;
color: #216558;
}
#quiz > #answer1:checked + .span_result1 > .result1 {
display: block;
bottom: -120px;
}
#quiz > #answer2:checked + .span_result2 > .result2 {
display: block;
bottom: -100px;
}
#quiz > #answer3:checked + .span_result3 > .result3 {
display: block;
bottom: -80px;
}
#quiz > #answer4:checked + .span_result4 > .result4 {
display: block;
bottom: -60px;
}
</style>
<form id="quiz">
    <b><i>Как вы произносите название "JavaScript"?</i></b><br>
    <input type="radio" name="quiz" id="answer1"><span class="span_result1">ДжаваСкрипт<div class="result1">Вы выбрали "ДжаваСкрипт"</div></span><br>
    <input type="radio" name="quiz" id="answer2"><span class="span_result2">ЯваСкипт<div class="result2">Вы выбрали "ЯваСкрипт"</div></span><br>
    <input type="radio" name="quiz" id="answer3"><span class="span_result3">ДжабаСкрипт<div class="result3">Вы выбрали "ДжабаСкрипт"</div></span><br>
    <input type="radio" name="quiz" id="answer4"><span class="span_result4">ЕваСкрипт<div class="result4">Вы выбрали "ЕваСкрипт"</div></span>
</form>
<script>
document.addEventListener( "DOMContentLoaded" , function() {
 let k = localStorage.indexAnswer;
 const inp = document.querySelectorAll('[name="quiz"]');
 const click = (elem, i) => elem.addEventListener("click", event =>
 (localStorage.indexAnswer === void 0) ? (localStorage.indexAnswer = i) :
 event.preventDefault()
 );
 inp.forEach(click);
 if(k !== void 0) inp[k].checked = true;
 });

</script>
Ответить с цитированием
  #4 (permalink)  
Старый 13.04.2020, 02:37
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Это скорее опрос, а не голосование, вот только без сервера, это ни то и не другое, это уже индивидуальная памятка или записки склеротика.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Хранение данных на клиенте monstantin Общие вопросы Javascript 1 25.07.2018 05:10
хранение данных расширения Клэр Оффтопик 3 29.05.2017 12:44
Хранение информации в кеше Untropee Общие вопросы Javascript 1 09.12.2016 08:45
Двойная Фильтрация данных таблицы David0707 Общие вопросы Javascript 0 19.03.2012 13:00
Хранение данных. 0931454574 AJAX и COMET 6 05.04.2011 23:21