Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <div class="container">
    <input type="checkbox" id="100" />
    <input type="checkbox" id="200" />
    <button onclick="save()">Save</button>
    <button onclick="readCheckboxes()">Load</button>
  </div>
</body>
</html>
 
function getCheckboxItems() {
    return ['100', '200']
        .map(function(selector) {
            return {
                selector: selector,
                element: document.getElementById(selector)
            }
        });
}
function serializeCheckboxes(elements) {
    var container = elements.reduce(function (accumulator, item) {
        accumulator[item.selector] = item.element.checked;
        return accumulator;
    }, {})
    localStorage.setItem('container', JSON.stringify(container));
}
function readCheckboxes() {
    var storage = localStorage.getItem('container'), //Your key
        container = (storage) ? JSON.parse(storage) : {};
    Object.keys(container).forEach(function(key) {
        var element = document.getElementById(key);
        if(element) {
            element.checked = container[key];
        }
    });
}
function save() {
    var elements = getCheckboxItems();
    serializeCheckboxes(elements);
}
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers