Question

我正在处理动态添加包含输入字段的列表项的待办事项列表应用程序。当我更改输入的值时，我可以看到它已经发生了变化（显然），并且它也根据通过jQuery获取val（）而发生了变化。

    $('#theList').on('change', '.listItem', function(e){
    currentList = $(this).val();
    alert(currentList); /* Changed value appears */
});

但是，我的最终目标是获取整个标记的innerHTML并通过本地存储保存。所以，如果我这样做：

    $('#theList').on('change', '.listItem', function(e){
    currentList = $('#theList').html();
    alert(currentList); /* List with unchanged value appears */
});

我得到所有列表项目的原始状态 - 并且丢弃更改的值。

我正在使用.on（）方法而不是已弃用/已删除的.live（）方法。我的整个例程都包含在document.ready（）中。

我错过了什么？

头撞墙乔

Answer 1

使用val()更改值或使用用户输入手动更改不会更改HTML属性，它会更改元素值属性，但您无法使用html()获取该值。

您可以使用attr('value', 'something')更改该值，它将更改属性以及您获得html()的标记，但您应该重新考虑将标记存储在localStorage中的整个概念，而是只存储键/值。

Answer 2

在显示内容之前，{{3}将新内容添加到#theList div怎么样？

另一种方法是通过append替换整个内容，请参阅以下示例。

代码示例：

$('#theList').on('change', '.listItem', function(e){
    currentList = $(this).val();
    alert(currentList); /* Changed value appears */
    $('#theList').html(currentList);
});

PS：我没有测试过......但是如果你提供一个jsFiddle，我愿意这样做;）

更改动态添加的输入值没有显示在jQuery html（）中？

2 个答案: