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

查看:32
本文介绍了使用 jQuery 删除 onclick 元素(包括删除按钮本身)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

这是我的问题:

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

我希望这个删除按钮可以自行删除它和其他两个元素.计数器应该具有相同的 Id,但我不确定我是否使用 jQuery 做到了这一点.

如何删除三个元素,包括点击删除按钮?

$(function() {无功计数器 = 0;$('a').click(function() {$('#box').append('');$('#box').append('<input type="text"; id="t1" + (counter) + "/>');$('#box').append('');$("#box").append("
");$("#box").append("
");计数器++;});$('removebtn').click(function() {删除(复选框");});});

解决方案

我的建议是这样的.

$(function () {无功计数器 = 0;$('a').click(function () {var elems = '

'+'<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("
");$("#box").append("
");计数器++;});$('.removebtn').live(function () {$(this).parent().remove();});});

简单演示

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.

Here is my question:

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

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.

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");
    });
});

解决方案

my suggestion would be like this.

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

simple demo

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

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆