且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何列出可以使用jQuery添加或删除的项目列表?

更新时间:2023-08-25 14:58:52

像通常在dom中一样绑定到#list,然后在.remove-item类上进行选择.这是小提琴: http://jsfiddle.net/nZ9y2/3/

Bind to the #list as it is always in the dom, then select on the .remove-item class. Here is the fiddle: http://jsfiddle.net/nZ9y2/3/

var item_number = 1;

var remove = function() {  
    $(this).parent().animate({opacity: 0}, function () {
        $(this).slideUp();
    });
}

$('#list').on('click', '.remove-item', remove);

$('.add-item-button').click(function() {
    var new_item = '<div class="item">' +
        'New Item ' + item_number +
        '<span class="remove-item">x</span>' +
        '</div>' 
    $(new_item).prependTo('#list').hide().slideDown();
    item_number = item_number + 1;
});