使用 jQuery 删除元素 onclick(包括删除按钮本身) [英] Remove elements onclick (including the remove button itself) with jQuery

问题描述

我知道有些问题看起来像我的问题，但在这种情况下，我希望删除按钮也被删除，但我不知道该怎么做.

I know there are some questions up which look like mine, but in this case I want the remove button to be removed as well and I don't know how I can do this.

这是我的问题:

单击附加按钮时，我使用 jQuery 附加 3 个元素.包括一个删除按钮.

I append 3 elements with jQuery when an append button is clicked. Including a remove button.

我希望这个移除按钮能够自行移除它和其他两个元素.计数器应该具有相同的 ID，但我不确定我是否使用 jQuery 正确地做到了这一点.

I want this remove button to remove it self and the other two elements. The counter should make identical Id's, but i'm not sure if i did this right way with jQuery.

如何删除三个元素，包括删除按钮 onclick?

How can i delete three elements including the remove button onclick?

$(function() {
    var counter = 0;
    
    $('a').click(function() {
        $('#box').append('<input type="checkbox" id="checkbox" + (counter) + "/>');
        $('#box').append('<input type="text" id="t1" + (counter) + "/>');
        $('#box').append('<input type="button" value="." id="removebtn" + (counter) + "/>');
        $("#box").append("<br />");
        $("#box").append("<br />");
        counter++;
    });
         
    $('removebtn').click(function() {
        remove("checkbox");
    });
});

推荐答案

我的建议是这样的.

$(function () {
    var counter = 0;

    $('a').click(function () {
        var elems = '<div>'+
              '<input type="checkbox" id="checkbox"' + (counter) + '" class="item"/>' + 
              '<input type="text" id="t1"' + (counter) + '"/>' +
              '<input type="button" class="removebtn" value="." id="removebtn"' + (counter) + '"/>' +
        '</div>';
        $('#box').append(elems);
        $("#box").append("<br />");
        $("#box").append("<br />");
        counter++;
    });

    $('.removebtn').live(function () {
        $(this).parent().remove();   
    });
});

这篇关于使用 jQuery 删除元素 onclick(包括删除按钮本身)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！