JavaScript通过函数更新全局变量不生效问题求助

你代码的问题出在console.log(taskValue)的执行时机不对：
脚本加载完成后会立刻同步执行这行打印语句，此时你还没有点击按钮触发赋值逻辑，全局变量taskValue自然一直是初始的空值。只有点击Add To List按钮触发getInputValue回调后，变量才会被更新为输入框的内容，你需要把验证变量值的逻辑放到回调函数内部才能拿到更新后的值。

修改后的JS代码 #

const createButton = document.getElementById('create-todo');
const errorOutput = document.getElementById('error-messages');
let taskValue = '';

const getInputValue = () => {
    // 每次触发先清空旧错误提示，避免重复堆积
    errorOutput.innerHTML = '';
    const inputValue = document.getElementById('task-input').value;
    
    if(inputValue === ''){
        errorOutput.innerHTML += `<p>Please Enter A Task</p>`;
    }else{
        taskValue = inputValue;
        // 赋值完成后再打印，就能拿到最新值
        console.log(taskValue);
    };
};

createButton.addEventListener('click', getInputValue);

你的HTML代码本身没有逻辑问题，不需要修改。如果后续需要基于更新后的taskValue做新增待办项等操作，对应的逻辑也都要放在getInputValue函数内部，或者在变量更新后主动调用对应的处理函数才行。

内容的提问来源于stack exchange，提问作者harjit.kainth7