删除隐藏的值,并在通过.html替换时

时间:2012-03-04 13:41:25

标签: javascript jquery html

我有一个代码,当我点击它们时,我可以通过隐藏的形式将某些" absentees"以及他们的ID添加到缺席列表中。当我再次点击它时,"缺席者"从缺席列表中删除。但是,当我再次点击它时,列表似乎因为br而进一步扩展 在我的代码加上隐藏的表单值似乎没有被删除。我需要删除隐藏值,以便从列表中删除的缺席者不会记录在数据库中。我需要br 这样缺席的名单就会出现。

这是我的代码:http://jsfiddle.net/gk5pV/8/

2 个答案:

答案 0 :(得分:1)

我完全同意@charlietfl,只使用块级元素。此外,使用单个隐藏输入来跟踪您的缺席者。 Example fiddle,代码如下:

$(function() {
    $("td").click(function() {
        var $this = $(this);
        var user = $this.attr('id');
        var p = $('<p />').attr('user', user).text($this.text());
        var absentees = [];
        if ($('#absentees').val().length > 0) {
            absentees = $('#absentees').val().split(',')
        }
        if ($(this).hasClass('on')) {
            //console.log("Already marked absent");
            //remove from collection
            $("#collect").children('p[user="' + user + '"]').remove();
            absentees.splice(absentees.indexOf(user), 1);
        }
        else {
            //console.log(user);
            //add to collection
            $("#collect").append(p);
            absentees.push(user);
        }
        $this.toggleClass('on');
        $('#absentees').val(absentees.join(','));
    });

    $("#clicky").click(function() {
        $('td').removeClass('on');
        $("#collect").empty();
        $('#absentees').val('');
     });
});​

答案 1 :(得分:0)

解决方案非常简单。将要追加的文本和隐藏的输入包装在块级元素(div,p,li等)中,您将不需要<br标记。如果从列表中删除缺席者,则删除块元素,输入将成为其中的一部分,因此它将不再存在。如果为新的块级元素提供类名,则只需将事件处理程序附加到类

即可