强制更新javascript中的变量

Question

我正在构建一个网站，其中包含多个输入的表格，每次按下复选框时我都需要更新一个特定的变量。 这是表格的一部分：

我有这个 javascript 函数来从相应的输入中删除只读属性：

//Remove the readonly atribute when checkbox is checked
var checkboxes = document.querySelectorAll("[id^='check_']")

for (var i = 0; i < checkboxes.length; i++){
    var checkbox = checkboxes[i];
    var inputId = checkbox.getAttribute("data-input-id");
    var inputElement = document.getElementById(inputId);
    (function(checkbox, inputElement){
        checkbox.addEventListener("change", function(){
            if (checkbox.checked){
                inputElement.removeAttribute("readonly")
            } else{
                inputElement.setAttribute("readonly", "readonly");
            };
        });
    })(checkbox, inputElement);
};

我在想我可以在这个函数中重新分配变量但是当我这样做时它说它的值永远不会被读取即使我在它下面的代码的其他部分使用它。 有谁知道我怎样才能强制更新这个变量。

注意：这是变量

var NumberInputs = document.querySelectorAll('input[type="number"]:not([readonly])');

编辑：此变量用于代码的这一部分

// Get all the number inputs in the table
var NumberInputs = document.querySelectorAll('input[type="number"]:not([readonly])');

// Save input values to localStorage whenever they change
NumberInputs.forEach(function(input){
    input.addEventListener('change', function(){
        localStorage.setItem(input.id, input.value);
    });
});

// Populate table with saved values when pages loads
window.addEventListener('load', function(){
    NumberInputs.forEach(function(input){
        var SavedValue = localStorage.getItem(input.id);
        if (SavedValue){
            input.value = SavedValue;
        }
    });
});

问题是当我选中复选框然后在刷新复选框状态后在输入中插入值时填充到表中但值不是，该值仅在刷新页面后填充然后再次插入值。我相信发生这种情况是因为在我选中复选框后变量没有更新，但只在页面加载时发生。