jquery - 使用 serializeArray 和观察者模式列出应用程序

Question

我正在尝试创建一个列表应用程序，该应用程序将允许用户将项目输入到将在提交时动态创建的文本字段（列表标记）。然后，我希望能够删除单独添加的任何项目（使用将添加到每个列表标签旁边的删除按钮）。

到目前为止，我在提交输入字段后设法创建了对象数组。

我怎样才能只获取 Array Object 的“值”以便动态创建我的列表标签？我怎样才能删除选定的元素？

我想通过使用观察者模式来完成该应用程序。

请参阅下面的代码：http: //jsfiddle.net/Lk3p8/

谢谢

Answer 1

我已经创建了您的jsFiddle的更新版本，它似乎可以满足您的需求。

...编辑...更新以反映您的要求。我没有注意到您将其保存在值数组中。对于那个很抱歉。我还对您的标记做了一些细微的更改。

$(document).ready(function(){

var deleteBtn = "<input class='deleteitem' type='button' value='Delete' name='delete' id='delete' />";
var values = [];
$("#myForm").submit(function(){
    var frm= $("#myForm").serializeObject();

    values.push(frm.item);


    $("#display").append("<li><p>" + frm.item +"</p>"+  deleteBtn +"</li>");
    return false;
});


$("#display").on("click", ".deleteitem", function(event){
    var removeItem = $(this).parent().children('p').text();
     $('.log').after("<p>"+removeItem +  " removed</p>");      
    $(this).parent().remove();


    values = jQuery.grep(values, function(value) {
       return value != removeItem;
    });

    console.log(values);
});


});

概念标记的证明不是最好的，但你明白了。