#javascript #jquery #cookies #popup #local-storage
#javascript #jquery #файлы cookie #всплывающее окно #local-storage
Вопрос:
Я пытаюсь использовать localStorage для запоминания пользовательских настроек, когда они нажимают «Остаться на международном». Таким образом, всплывающее окно не будет продолжать запрашивать всякий раз, когда пользователь посещает страницу.
Я не смог найти способ запомнить состояние закрытия модального окна jQuery и поместить его в файлы cookie localStorage. Ваша помощь будет высоко оценена!
<!-- jQuery Modal -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" />
<div id="countryModal" NAME="country" class="modal">
<a rel="modal:close" href="#" onclick="gotoInternational()">Stay at International</a>
</div>
<script>
setTimeout(function(){
jQuery('#countryModal').fadeIn('slow').modal('show');
},3000)
function gotoInternational(){
//localStorage codes here
}
</script>
Ответ №1:
Отличный вопрос! На вашем месте я бы изучил localStorage немного подробнее. Вы абсолютно правы, сохранение значения в localStorage — лучший способ. Если я правильно понимаю, что вы хотите сделать, ваш код должен выглядеть следующим образом:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- jQuery Modal -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" />
<div id="countryModal" NAME="country" class="modal">
<a rel="modal:close" href="#" onclick="gotoInternational()">Stay at International</a>
</div>
<script>
//Get current localStorage value
const gotoInternationalValue = localStorage.getItem('gotoInternational');
//Check if it is not true (can be false or null)
if (gotoInternationalValue != 'true') {
setTimeout(function() {
jQuery('#countryModal').fadeIn('slow').modal('show');
}, 3000)
} else {
console.log("Stay at international was already selected");
}
function gotoInternational() {
//Save localStorage item as true
localStorage.setItem('gotoInternational', true);
}
</script>
Если это не то, что вам нужно, пожалуйста, добавьте больше информации в свой вопрос, чтобы прояснить его!
Ответ №2:
Я нашел решение!
Ваше решение правильное, просто вы пропустили здесь одну кавычку:
if (gotoInternationalValue != ‘true’)
В любом случае спасибо за ваш вклад! Спас мой день!
Комментарии:
1. Я соответствующим образом отредактировал свой ответ, не могли бы вы отметить его как правильный ответ! Спасибо
2. Конечно! Спасибо, приятель 🙂