为什么我的localStorage复选框/布尔值比较不适用于我的Google Chrome扩展

Why is my localStorage checkbox/boolean value comparison not working for my Google Chrome Extension?

本文关键字：我的 适用于 Google 扩展 不适用 Chrome 布尔值 localStorage 复选框 为什么 比较      更新时间：2023-09-26

我已经成功地将一个布尔变量映射到我的本地存储变量，这是由我的Chrome扩展的options.html页面上的复选框触发的。

我想知道的是，根据我的popup.html（浏览器按钮事件）选项中是否选中了复选框，显示/隐藏元素的最佳方式是什么；不起作用——我也不希望它起作用……但我有点不知所措，无法控制向最终用户显示这些元素的最佳方式。

注意：display:none for CSS也是一个选项——我只是不知道最好的方法。

   var value = localStorage["myCheckbox"];
   alert(localStorage.getItem('store.settings.myCheckbox'));
   if (value != null)
        alert(value);//this works (true if checked, false if not checked...)
    if (!value){
        alert('hide the element'); 
        $("#myElement").hide(); //hide a div element in my popup (chrome extension button popup)
    }

我假设您将复选框的.checked属性分配给localStorage["myCheckbox"]，因此，由于localStorage变量只能是字符串，它可以是"true"或"false"，具体取决于复选框的状态。

你的错误是这样做的：

if (!value) { 
    ...
}

上述条件永远不会满足，因为非空字符串（如"true"或"false"）在JavaScript中总是true，所以!"string"总是false。因此，要在popup.js中检查复选框的值，您应该执行以下操作：

var isChecked = localStorage.myCheckbox === "true";
if (!isChecked) $('#myElement').hide();
// if the checkbox is not checked hide the element

好吧，我解决了第一个问题-（它返回字符串，所以我需要使用===）

然而，我仍然需要找出完成第2部分的最佳方法——显示/隐藏功能。我将发布一个新问题，并通过链接更新此问题。非常感谢你的帮助，马可！

   var value = localStorage["myCheckbox"];
   var isChecked = localStorage.getItem('store.settings.myCheckbox');
    if (isChecked === "false"){ 
    alert('its FALSE');
    $('#myElement').hide();
    }
    if (isChecked === "true"){
    alert('its TRUE');
    $('#myElement').show();
    }
相关文章：