jquery - 复选框图像在浏览器后退按钮上重置

Question

我正在使用自定义图像来显示复选框并隐藏真正的复选框。我的表单有 2 个部分，所以如果我选择了复选框，然后转到表单的下一部分/页面，然后单击浏览器的后退按钮，隐藏的复选框仍然被选中，但是图像/类被重置所以它似乎未选中复选框。

var $checkStyle    = $('<span class="check-style"></span>'),
    $product       = $('.productBox'),
    $checkBox      = $('#webform-client-form-18070 .form-checkbox');

    $checkBox.hide();
    $checkStyle.appendTo('.selectCheck');

    $product.click(function(){
        var $this        = $(this),
            $checkSingle = $this.find('.check-style'),
            $checkbox    = $this.find(':checkbox');

        $checkSingle.toggleClass('check-style-selected');
        $checkbox.attr('checked', !$checkbox.attr('checked'));
});

.check-style-selected 类显示选中的复选框图像。单击浏览器后退按钮时，如何将该类保留在元素上？

谢谢。

Answer 1

为什么不：

$(":checkbox").each(function(){
    if ($(this).is(":checked") { 
       $(this).addClass("checked")
   } else { $(this).addClass("unchecked") }
})