复选框关闭和打开，页面重新加载后保持打开状态

Question

我正在使用 Font Awesome 复选框 on/off 和下面的脚本来在单击时关闭和打开。

如果我的链接是#，这就可以正常工作，但我最近更改了我的链接以通过单击复选框提交表单。这个问题是一旦页面重新加载，复选框就会回到初始状态。我不是 Javascript 专业人士，我想知道是否可以将变量传递给脚本以设置状态 off/on?

<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>&nbsp; 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>

Answer 1

尝试执行 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>&nbsp; Checkbox 1</li>
</ul>

Fiddle

Answer 2

如前所述，因为您已经将该值添加到隐藏输入中，所以您可以使用以下方法再次捕获它：

class="<?=($_POST['your_checkbox_name'] == 'x')?'class_name':''?>"

复选框关闭和打开，页面重新加载后保持打开状态

Checkbox toggle off and on, stays on after page reload

php

jquery

font-awesome