Javascript 即使在使用localStorage刷新页面后也检索禁用的属性

我有一个带有select标记的HTML代码，其中的选项是动态填充的。一旦onchange事件发生，所选选项将被禁用。此外，如果出现任何页面导航，则会检索以前填充的选项

在我的例子中，一旦填充了选项并且选择了任何选项，就会被禁用（不允许用户再次选择它的意图）。因此，可能会出现这样的情况：在3个选项中，只有两个被选中并禁用，因此，一旦我刷新，以前未选中的选项应该被启用。并且应该禁用以前选择的选项。但我的代码在刷新后启用了所有选项。我怎样才能解决这个问题

html代码

<select id="convoy_list" id="list" onchange="fnSelected(this)">
    <option>Values</option>
    </select>

//此函数表示下拉列表中的进程--关于如何填充数据

function test(){
    $.ajax({
    //some requests and data sent
    //get the response back

    success:function(responsedata){
        for(i=0;i<responsedata.data;i++):
        {
            var unitID=//some value from the ajax response
            if(somecondition)
            {
                var select=$(#convoy_list);
                $('<option>').text(unitID).appendTo(select);
                var conArr=[];
                conArr=unitID;
                test=JSON.stringify(conArr);
                localStorage.setItem("test"+i,test);
            }
        }
    }
    });
}

功能测试（）{
$.ajax({
//发送了一些请求和数据
//回复
成功：功能（responsedata）{
页面上的for（i=0；i元素不应具有相同的ID

<select id="convoy_list" onchange="fnSelected(this)">
    <option>Values</option>
    </select>

现在我们可以在
fnSelected（）
中使用该id：

现在在
display（）
中：

注意一些错误，我没有测试所有这些，但希望理解逻辑。
我立即看到一件事：localStorage将值存储为字符串，因此您应该执行以下操作
localStorage.getItem（“vehId”）==“true”
.true和“true”没有相互强制。它不起作用。它禁用下拉列表中的所有值，但我只希望禁用上一次禁用的值。
function display(){
for(var i=0;i<localStorage.length;i++){

    var listId=$.parseJSON(localStorage.getItem("test"+i)));
    var select=$(#list);
        $('<option>').text(listId).appendTo(select);
}
}

if(localStorage.getItem("vehId")==true){
     var select=$(#list);
            $('<option>').text(listId).attr("disabled",true).appendTo(select);
}

<select id="convoy_list" onchange="fnSelected(this)">
    <option>Values</option>
    </select>

function test(){
    $.ajax({
    //some requests and data sent
    //get the response back

    success:function(responsedata){
        for(i=0;i<responsedata.data;i++):
        {
            var unitID=//some value from the ajax response
            if(somecondition)
            {

                var select=$("#convoy_list"); \\don't forget quotes with selectors. 
                var itemId = "test" + i;
                $('<option>').text(unitID).attr("id", itemId) \\we have set id for option
                                          .appendTo(select);
                var conArr=[];
                conArr=unitID;
                test=JSON.stringify(conArr);
                localStorage.setItem(itemId,test);
            }
        }
    }
    });
}

function fnSelected(options) {
    var selected = $(options).children(":selected");
    selected.prop("disabled","disabled");
    localStorage.setItem(selected.attr("id") + "disabled", true);
}

function display(){
   for(var i=0;i<localStorage.length;i++){
       var listId = $.parseJSON(localStorage.getItem("test"+i)));
       var select = $("convoy_list");
       var option = $('<option>').text(listId).id(listId);
                                 .appendTo(select);
       if(localStorage.getItem(listId + "disabled") == "true"){
         option.prop("disabled","disabled");
       }
       option.appendTo(select);
   }
}

function fnSelected(selctdOption){
      selctdOption.options[selctdOption.selectedIndex].disabled=true;
      var vehId = selctdOption.options[selctdOption.selectedIndex].disabled;
      localStorage.setItem("vehId",vehId); \\ and "vehId" is just a string, always the same.

}