时间戳

首页 > 解决方案 > 当用户单击更新按钮时，如何在 TODO 应用程序的输入字段中设置 li 值（li 内的文本）？

javascript - 当用户单击更新按钮时，如何在 TODO 应用程序的输入字段中设置 li 值（li 内的文本）？

问题描述

下面是我的代码，实际上我想在用户单击更新按钮时将 li 文本设置到输入字段中。当用户单击更新按钮时会显示代码正在工作的输入元素，但 li 标签中的值未显示在输入字段中，但显示在控制台中我还附上了图片以在替换输入时清除它带按钮

 [function addTodo() {
      // create li
      var todo_input = document.getElementById('todo-input');
      var li = document.createElement('li');
      var textNode = document.createTextNode(todo_input.value);
      li.setAttribute('class', 'li');
      li.appendChild(textNode);
    
      // create update button
      var updateBtn = document.createElement('button');
      var updateText = document.createTextNode('UPDATE');
    
    li.appendChild(updateBtn);
      li.appendChild(deleteBtn);
    
      addList.appendChild(li);
    
    
    }
    
    
    function updateItem(e) {
    
      var val1 = e.parentNode.firstChild;
    
      var inputVal = document.createElement('input');
      inputVal.setAttribute('class','todo-input');
      inputVal.setAttribute('type','text');
    
    var textNode = document.createTextNode(val1.nodeValue);
    inputVal.appendChild(textNode);
    }][1]

标签： javascriptdom

解决方案

不要在输入框中附加文本。使用值属性。

inputVal.value = val1.nodeValue;

推荐阅读