如何使用.val()填充输入字段?

时间:2013-03-02 03:58:56

标签: javascript jquery local-storage

我正在尝试编辑我的列表项,并且我想将父节的文本设置为带有.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>

我在jquery中的循环中生成了一些html:

<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>

1 个答案:

答案 0 :(得分:1)

为什么不将处理程序附加到具有editable类的范围?

这样的事情:

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

请注意,ID必须是唯一的。分配相同的ID是错误的:'完成','不完整','完成'到几个部分。