Флажок выключается и включается, остается после перезагрузки страницы
Я использую флажок Font Awesome вкл / выкл и скрипт ниже для включения и выключения при нажатии.
Это работает нормально, если мои ссылки #, но я недавно изменил свои ссылки, чтобы отправить форму по щелчку флажка. Эта проблема, когда страница перезагружается, флажок возвращается к начальному состоянию. Я не профессионал в Javascript, и мне интересно, могу ли я передать переменную в скрипт, чтобы установить состояние вкл / выкл?
<ul id="setting-cb">
<li class="wet-asphalt"><a href="<?php echo $my_url; ?>"><i class="fa fa-check-square-o wet-asphalt"></i></a> Checkbox 1</li>
</ul>
<script>
$('#setting-cb li a').click(function(){
$(this).next('ul').slideToggle('500');
$(this).find('i').toggleClass('fa-square-o fa-check-square-o')
});
</script>
Решение
Как уже говорилось, поскольку вы уже добавили значение к скрытому вводу, вы можете просто перехватить его снова, используя это:
class="<?=($_POST['your_checkbox_name'] == 'x')?'class_name':''?>"Другие решения
Попробуйте выполнить Ajax-вызов.
Вот пример:
JS:
$("#setting-cb li a").click(function(e) {
e.preventDefault();
$(this).next('ul').slideToggle('500');
$(this).find('i').toggleClass('fa-square-o')
$.ajax({
url: '/destination.php',
type: 'POST',
data: {
//your data Here
},
success: function(response) {
//Do something here...
}
});
});
HTML:
<ul id="setting-cb">
<li class="wet-asphalt"><a href=""><i class="fa fa-check-square-o wet-asphalt fa-square-o"></i></a> Checkbox 1</li>
</ul>