Question

我的问题是，当我尝试选中复选框并刷新页面时，复选框将返回取消选中。

<html>
<head>
    <title>TODO supply a title</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width">
    <script src ="js/jquery.js"></script>
    <script src ="js/jquery.cookie.js"></script>
    <script>
        $("input.box").each(function() {
          var mycookie = $.cookie($(this).attr('name'));
          if (mycookie && mycookie === "true") {
          $(this).prop('checked', mycookie);
            }
            });
        $("input.box").change(function() {
            $.cookie($(this).attr("name"), $(this).prop('checked'), {
            path: '/',
            expires: 365
     });
});
    </script>

</head>
<body>
    <table cellpadding="0" cellspacing="5" width="100%" height="60%">
        <tr>
            <td width="20%" height="20%"><input class="box" type="checkbox" name="1" /></td>
            <td width="20%" height="20%"><input class="box" type="checkbox" name="2" /></td>
            <td width="20%" height="20%"><input class="box" type="checkbox" name="3" /></td>
        </tr>
    </table>
 </body>
</html>

您认为代码的问题是什么？建议请。谢谢。

Answer 1

您需要将脚本放在document.ready中，以便jquery工作并存储并检索cookies，因为jquery代码在将所需的html元素添加到{{1}之前运行}。

DOM

刷新时保留复选框的值

1 个答案: