javascript - 根据多个选项卡中的cookie更新div元素值

标签 javascript jquery cookies

我根据 cookie 的值插入和删除 div。通过选中和取消选中复选框来更新 cookie 的值。这对于单个选项卡来说效果很好。 但是如果为同一页面打开多个选项卡,如何更新其他选项卡中的 div。 cookie 值会更新,因为它对于浏览器而言保持不变,但如何根据 cookie 值添加或删除 div。

最佳答案

如果您同意使用本地存储而不是 Cookie,则可以使用 storage 事件,该事件会在对本地存储进行更改时触发。

参见http://synccheckbox.site44.com/一个运行的例子。代码粘贴如下:

<!doctype html>
<html>
<head>
    <style>html { font-family:Arial }</style>
</head>
<body>
    This checkbox should synchronize between open tabs:
    <input type="checkbox" id="checkbox" />

    <script>
        function updateCheckbox() {
            document.getElementById('checkbox').checked =
                (localStorage.checked === 'true');
        }
        updateCheckbox();

        document.getElementById('checkbox').addEventListener('change', function () {
            localStorage.checked = this.checked;
        });

        window.addEventListener('storage', function () {
            updateCheckbox();
        });
    </script>
</body>
</html>

关于javascript - 根据多个选项卡中的cookie更新div元素值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37804020/

相关文章:

javascript - meteor 中的 Node js 二进制文件有什么用?

javascript - 重置/刷新每个点击事件的模态数据

javascript - 删除类(class)添加类(class)问题

javascript - 使用 jQuery 消费 JSON

php - Laravel session 在每次加载时重新生成

javascript - 从 Handsontable 导出为 Excel

javascript - 未定义 react Firebase初始化应用程序

javascript - 我如何使用 jquery ajax 将 webapi Controller 中的 webform 值作为模型类传递

PHP if 与 MySQLWhere 比较(哪个更高效)

security - 哪些浏览器默认阻止第 3 方 cookie?