在Javascript中更新for循环中的localStorage变量

Question

我正在使用JSTree来呈现我的一些目录和子目录。在js树中，我启用了复选框，当用户选择多个复选框时，我禁用第一个选择以启用第二个选择。以下是我的代码：

$(document).ready(function(){
    $("#annotateDirectories").jstree({
        "checkbox": {   
        'tie_selection' : false,        
        'two_state' : true 
    },

    'plugins': ['wholerow', 'search','checkbox', 'sort']
    });

    //control brand selection within annotated directories
    $('#annotateDirectories').on('check_node.jstree uncheck_node.jstree', function(e, data){
            var brandNode = data.instance.get_node(data.selected[1]);
        if(data.instance.get_checked().length>1){
          data.instance.uncheck_node(data.selected[0]);
            if (typeof brandNode.text === "undefined" || typeof brandNode.text === "") {
                alert("select a brand");
            } else {
                localStorage.clear();
                localStorage.setItem('brandNode', brandNode.text);
                show_message("Selected Brand: " +brandNode.text);   
            }
        }
        });
});

我将所选品牌存储在localStorage中。

在画布中我绘制矩形。对于每个绘制的矩形，我想从localStorage分配品牌名称。

以下是for循环的一部分。

function draw_all_region_id() {
  _iris_reg_ctx.shadowColor = "transparent";
  for ( var i = 0; i < _iris_img_metadata[_iris_image_id].regions.length; ++i ) {
    var canvas_reg = _iris_canvas_regions[i];

    var bbox = get_region_bounding_box(canvas_reg);
    var x = bbox[0];
    var y = bbox[1];
    var w = Math.abs(bbox[2] - bbox[0]);
    var brandName = (i+1);

现在使用(i+1)，我可以将一个增量数字附加到边界框。我面临的问题是当我改变时

var brandName = localStorage.getItem("brandNode");

由于这是在for循环中，因此对于每个矩形，它都指定相同的名称。此外，当我绘制一个带有变量名称的新矩形时，所有早期矩形的名称都会更改为新名称。

Answer 1

您应该使用每个品牌的唯一名称存储localStorage中的项目，否则任何具有相同键的新写入都将覆盖前一个。

您应该将值存储在localStorage中，如下所示。

  localStorage.setItem('brandNode' + uniqueId, brandNode.text);

应该使用相同的密钥来访问它。

不要像你现在那样清楚地清理本地存储

localStorage.clear();

而是从localStorage中删除特定项目