如何存储复选框和数组值(cookie)

时间:2014-06-21 17:00:27

标签: javascript jquery html arrays

我想在更长的时间内保存我的复选框的布尔值。此外,我需要将每个复选框的值存储在一个数组中以便稍后读出它们。我尝试了一些关于cookie的示例代码和教程,但似乎没有任何工作。

使用checklist_1s.html我访问checklistRequest.js以存储我的数组中每个复选框的值。后来我需要在另一个窗口中将这个数组用于另一个js函数,但是当我打开这个窗口时,我的数组就不见了。

我在这里寻找一个简单的解决方案,如果可能的话。

注意:我知道每个复选框都使用相同的名称是违规,但它似乎工作到目前为止,我找不到任何其他方法让它适用于每个复选框(我需要200以后)

checklist_1s.html

<html>
<head>
<link rel="stylesheet" type="text/css" href="../../style.css"></link>
<script src="checklistRequest.js" type="text/javascript"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/json2/20110223/json2.js"></script>
<script src="https://raw.github.com/andris9/jStorage/master/jstorage.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://cdn.jsdelivr.net/jquery.cookie/1.4.0/jquery.cookie.min.js"></script>
<style>
</style>
</head>
<body class="main">
<div class="main_2">
    <p>
        <h1>Checklist</h1>

        <form>
            <input type="checkbox" name="remember" id="remember" onclick="checkboxFunction(value, 0)" value="F-Card geholt">F-Card geholt<br>
            <input type="checkbox" name="remember" id="remember" onclick="checkboxFunction(value, 1)" value="Ersti Rally">Ersti Rally <br>
            <input type="checkbox" name="remember" id="remember" onclick="checkboxFunction(value, 2)" value="TEST">TEST<br>
        </form>

        <input type="button" name="alert" value="Aktualisieren" onclick="alertFunction()">



        <!-- Example Code-->
        <script>
          $("#checkAll").on("change", function(){
            $(':checkbox').not(this).prop('checked', this.checked);
          });

          $(":checkbox").on("change", function(){
            var checkboxValues = {};
            $(":checkbox").each(function(){
              checkboxValues[this.id] = this.checked;
            });
            $.cookie('checkboxValues', checkboxValues, { expires: 7, path: '/' })
          });

          function repopulateCheckboxes(){
            var checkboxValues = $.cookie('checkboxValues');
            if(checkboxValues){
              Object.keys(checkboxValues).forEach(function(element){
                var checked = checkboxValues[element];
                $("#" + element).prop('checked', checked);
              });
            }
          }

          $.cookie.json = true;
          repopulateCheckboxes();
        </script>

    </p>
</div>
</body>
</html>

checklistRequest.js

var checkbox = document.getElementsByName("remember");
var checkboxArray = [];

function checkboxFunction(value, index)
{
    if(checkbox[index].checked == true)
    {
        checkboxArray[index] = value;
    }
    if (checkbox[index].checked == false && value == checkboxArray[index])
    {
        checkboxArray[index] = null;
    }
}

function alertFunction()
{
    for(var i=0; i<99; i++)
    {
        if (typeof checkboxArray[i] != 'undefined' && checkboxArray[i] != null) 
        {
            alert(checkboxArray[i]); 
        }
    }  
    alert("TEST");  
}

0 个答案:

没有答案