更新

Question

我试图删除我以前的Jquery代码插入的div。

$counter = 0;
$("#add").click(function() {
    $counter++;
    $("#ipblock").append('<input type="text" name="inputip" id="inputip'+$counter+'" size="22" /></br>');
});

$("#del").click(function() {
    $("#inputip'+$counter+'").remove();
    $counter = parseFloat(counter) - 1;
});

完整演示可以在http://jsfiddle.net/felix001/fQBNE/26/找到。我可以通过firebug看到输入具有正确的id。但是当我尝试在jquery和firebug控制台中删除它时，它无法找到div（??）。

任何人都能指出我正确的方向。

谢谢，

Answer 1

您的代码中有一些错误：

$counter = 0;
$("#add").click(function() {
    $counter++;

    //I removed the `<br />` tag and added a bit of CSS because if you remove the <input /> tags the <br /> tags added with them remain
    $("#ipblock").append('<input type="text" name="inputip" id="inputip'+$counter+'" size="22" />');
});

$("#del").click(function() {

    //this just makes sure there is actually an element to select before trying to select it
    if ($counter) {

        //use double quotes to start and stop the string here
        $("#inputip"+$counter).remove();

        //make sure to refer to `$counter` and not `counter`
        $counter = $counter - 1;
    }
});

以下是演示：http://jsfiddle.net/fQBNE/29/

我添加了此CSS，因此<br />电话中不需要.append()标记：

/*This will put each input on its own line*/
#ipblock > input {
    display:block;
}

更新

在没有$counter变量的情况下实现此目的的另一种方法是选择input点击事件处理程序中的最后一个#del元素：

$("#add").click(function() {

    //notice no ID is needed
    $("#ipblock").append('<input type="text" name="inputip" size="22" />');
});

$("#del").click(function() {

    //first try to select the last inputip element
    var $ele = $('#ipblock').children('input[name="inputip"]').last();

    //only proceed if an element has been selected
    if ($ele.length) {

        //and now remove the element
        $ele.remove();
    }
});

以下是演示：http://jsfiddle.net/fQBNE/31/

Jquery - 无法删除DIV

1 个答案:

更新