Как заполнить поле ввода с помощью .val()?

Question

Я пытаюсь редактировать элементы списка, которые у меня есть, и я хочу установить текст родительского раздела в поле формы с помощью .val(). Я также хочу удалить его из локального хранилища, проблема заключается в том, что я понятия не имею, как это сделать, и, похоже, это не популярно в Интернете, потому что я не могу найти его нигде.

Это, как я везу в данных через форму ввода:

function addTodo(form) { 
    var input = $(form).find('input[name="todo"]').first(); 
    if (input) {  
     var todo = input.val(); 
     if (Modernizr.localstorage) { 
      var todo_list = {}; 
      if (localStorage.todos) { 
       todo_list = JSON.parse(localStorage.todos); 
      } 
      var id = +new Date; 
      todo_list[id] = { 
       name: todo, 
       completed: false 
      }; 
      localStorage.todos = JSON.stringify(todo_list); 
      drawTodos(); 
     } 
     input.val(''); 
    } 
    if (jQuery.fn.validate) { 
     $(form).validate().resetForm(); 
    } 
} 

Как бы выбрать элемент списка, который я добавил так, что она будет в конечном итоге обратно во входном Фейлде так Я могу его отредактировать?

<section> 
      <h1>List</h1> 
     </section> 
     <section id="todo_list"> 
      <header> 
       <form> 
        <input type="text" name="todo" placeholder="What do you need to do?" /> 
        <input type="submit" name="add_todo" value="Add To List" /> 
       </form> 
      </header> 
     </section> 

У меня есть некоторые HTML генерации в цикле внутри JQuery:

<section class="todo_item" id="item' + id + '"><span id="complete" class="colour complete">Complete</span><span id="incomplete" class="colour incomplete">Incomplete</span><span class="content editable" id="done">' + todo.name + '</span><a href="#" class="remove_todo"><img src="img/delete.png" /></a></section> 

Answer 1

Почему вы не прикрепить обработчик размаху, который имеет editable класс?

Что-то вроде этого:

$(document).ready(function() { 
    $(".content.editable").click(function() { 
     $("input[name='todo']").val($(this).text()); 
    }); 
}); 

Пожалуйста, обратите внимание, что идентификаторы должны быть уникальными. Ошибочно назначать одинаковые идентификаторы: «done», «uncomplete», «complete» для нескольких разделов.