Question

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

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

我怎样才能抓住＆＃34;值＆＃34;为了动态创建我的列表标签？如何删除所选元素？

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

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

由于

Answer 1

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

..编辑...已更新以反映您的请求。我没注意到你将它保存在values数组中。对于那个很抱歉。我也对你的标记做了一些细微的修改。

$(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);
});


});

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

使用serializeArray和observer模式列出应用程序

1 个答案: