输入字段空白验证不起作用的javascript

我正在做一个待办事项列表，如果作为任务的输入字段为空，则不应将其附加到任务列表（即if (taskInput == "")在addTask函数中），但这未反映在网站上。有什么解决方案？

我的代码

我的JavaScript代码：

var taskInput=document.getElementById("new-task");//Add a new task.
var addButton=document.getElementsByTagName("button")[0];//first button
var incompleteTaskHolder=document.getElementById("incomplete-tasks");//ul of #incomplete-tasks
var completedTasksHolder=document.getElementById("completed-tasks");//completed-tasks

//New task list item
var createNewTaskElement=function(taskString){

    var listItem=document.createElement("li");

    //input (checkbox)
    var checkBox=document.createElement("input");//checkbx
    //label
    var label=document.createElement("label");//label
    //input (text)
    var editInput=document.createElement("input");//text
    //button.edit
    var editButton=document.createElement("button");//edit button

    //button.delete
    var deleteButton=document.createElement("button");//delete button

    label.innerText=taskString;

    //Each elements, needs appending
    checkBox.type="checkbox";
    editInput.type="text";

    editButton.innerText="Edit";//innerText encodes special characters, HTML does not.
    editButton.className="edit";
    deleteButton.innerText="Delete";
    deleteButton.className="delete";

    //and appending.
    listItem.appendChild(checkBox);
    listItem.appendChild(label);
    listItem.appendChild(editInput);
    listItem.appendChild(editButton);
    listItem.appendChild(deleteButton);
    return listItem;
}

var addTask=function(){
    console.log("Add Task...");
    //Create a new list item with the text from the #new-task:
    var listItem=createNewTaskElement(taskInput.value);

    //Append listItem to incompleteTaskHolder
    if (taskInput == ""){
        document.getElementById("warning").innerHTML = "Paragraph changed!";
    }else{
        incompleteTaskHolder.appendChild(listItem);
        bindTaskEvents(listItem, taskCompleted);
    }
    taskInput.value="";
}
//Edit an existing task.

var editTask=function(){
console.log("Edit Task...");
console.log("Change 'edit' to 'save'");

var listItem=this.parentNode;

var editInput=listItem.querySelector('input[type=text]');
var label=listItem.querySelector("label");
var containsClass=listItem.classList.contains("editMode");
        //If class of the parent is .editmode
        if(containsClass){
        //switch to .editmode
        //label becomes the inputs value.
            label.innerText=editInput.value;
        }else{
            editInput.value=label.innerText;
        }
        //toggle .editmode on the parent.
        listItem.classList.toggle("editMode");
}
//Delete task.
var deleteTask=function(){
        console.log("Delete Task...");

        var listItem=this.parentNode;
        var ul=listItem.parentNode;
        //Remove the parent list item from the ul.
        ul.removeChild(listItem);
}

//Mark task completed
var taskCompleted=function(){
        console.log("Complete Task...");
    
    //Append the task list item to the #completed-tasks
    var listItem=this.parentNode;
    completedTasksHolder.appendChild(listItem);
                bindTaskEvents(listItem, taskIncomplete);
}

var taskIncomplete=function(){
        console.log("Incomplete Task...");
//Mark task as incomplete.
    //When the checkbox is unchecked
        //Append the task list item to the #incomplete-tasks.
        var listItem=this.parentNode;
    incompleteTaskHolder.appendChild(listItem);
            bindTaskEvents(listItem,taskCompleted);
}

var ar=function(){
    console.log("Ar");
}

//The glue to hold it all together.

//Set the click handler to the addTask function.
addButton.onclick=addTask;
addButton.addEventListener("click",addTask);
addButton.addEventListener("click",ar);

var bindTaskEvents=function(taskListItem,checkBoxEventHandler){
    console.log("bind list item events");
//select ListItems children
    var checkBox=taskListItem.querySelector("input[type=checkbox]");
    var editButton=taskListItem.querySelector("button.edit");
    var deleteButton=taskListItem.querySelector("button.delete");


            //Bind editTask to edit button.
            editButton.onclick=editTask;
            //Bind deleteTask to delete button.
            deleteButton.onclick=deleteTask;
            //Bind taskCompleted to checkBoxEventHandler.
            checkBox.onchange=checkBoxEventHandler;
}
//cycle over incompleteTaskHolder ul list items
    //for each list item
    for (var i=0; i<incompleteTaskHolder.children.length;i++){

        //bind events to list items chldren(tasksCompleted)
        bindTaskEvents(incompleteTaskHolder.children[i],taskCompleted);
    }
//cycle over completedTasksHolder ul list items
    for (var i=0; i<completedTasksHolder.children.length;i++){
    //bind events to list items chldren(tasksIncompleted)
        bindTaskEvents(completedTasksHolder.children[i],taskIncomplete);
    }