Question

有人可以告诉我我的代码出了什么问题吗？

请理解我只是一个初学者学习jquery。我正在尝试使用<table>创建一个检查列表，您可以在其中添加和删除项目，当您单击复选框时，会出现一个复选标记，然后显示“已完成！”包含在另一个<td>上。再次单击复选框后，复选标记将消失。你可以看到我的小提琴：http://jsfiddle.net/linyingsinc/w6XxP/1/

我最初将.checked设置为隐藏，以便.toggleClass可以在点击时移除该类，从而显示复选标记。它最初工作正常，但当我添加这个jquery：

$(this).toggle(function() {  
var itemDone = '<td class="complete">done!</td>';  
$(this).parent('tr').append(itemDone);  
});

...包含<tr>的整个<td class="checkbox">在一秒钟后完全消失。我只是希望能够切换复选标记和“完成！”咬一下。

Answer 1

在最新版本的jQuery中删除了toggle()函数的那个版本，因此您现在使用的toggle()函数可以切换可见性，只是隐藏或显示所有内容。

您必须创建自己的切换功能：

$(document).on('click','.checkbox',function() {
    $(this).find('span').toggleClass('checked');
    if ($(this).parent('tr').find('.complete').length) {
        $(this).parent('tr').find('.complete').remove();
    }else{
        var itemDone = '<td class="complete">done!</td>';
        $(this).parent('tr').append(itemDone);
    }
});

FIDDLE

完全消失.click功能

1 个答案: