Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/81.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
如何删除jquery中最后一个动态生成的div_Jquery_Html - Fatal编程技术网

如何删除jquery中最后一个动态生成的div

如何删除jquery中最后一个动态生成的div,jquery,html,Jquery,Html,这是我的html div#字段是通过单击按钮动态生成的。 单击时,必须删除最后一个div字段 html 1. 2. 3. jquery $('#addairdata').on('click', function (event) { event.stopPropagation(); event.preventDefault(); var lastField = $("#buildyourform div:last"); var intId = (lastFie

这是我的html div#字段是通过单击按钮动态生成的。 单击时,必须删除最后一个div字段

html


1.
2.
3.
jquery

$('#addairdata').on('click', function (event) {
    event.stopPropagation();
    event.preventDefault(); 
    var lastField = $("#buildyourform div:last");
    var intId = (lastField && lastField.length && lastField.data("idx") + 1) || 1;
    // console.log(intId);
    var fieldWrapper = $("<div class=\"fieldwrapper input-group input-group-sm mb-3 overflow-auto\" id=\"field" + intId + "\"/>");
    fieldWrapper.data("idx", intId);
    var fName = $("<input type=\"number\" class=\"fieldname col-6 form-control\" id=\"af" + intId + "\"/>");
    var fType = $("<input type=\"number\" class=\"fieldtype col-4 form-control\" id=\"sp" + intId + "\" />");

    // var fType = $("<select class=\"fieldtype\"><option value=\"checkbox\">Checked</option><option value=\"textbox\">Text</option><option value=\"textarea\">Paragraph</option></select>");
    // var removeButton = $("<button type=\"button\" class=\"col-2 btn btn-sm btn-outline-primary float-right\" disabled>"+intId+"</button>");
    // removeButton.click(function() {
    //     $(this).parent().remove();
    // });
    // console.log(intId);

    console.log(intId);


    var removeButton = $(".remove")

    removeButton.click(function() {

        console.log(intId-intId);
        // $("#buildyourform div:last-child").remove()
        // $("#field"+intId).remove();   
        // $("#field"+intId).remove();
    });
    fieldWrapper.append(fName);
    fieldWrapper.append(fType);
    fieldWrapper.append(intId);
    $("#buildyourform").append(fieldWrapper);

})
$('addairdata')。在('click',函数(事件){
event.stopPropagation();
event.preventDefault();
var lastField=$(“#buildyourform div:last”);
var intId=(lastField&&lastField.length&&lastField.data(“idx”)+1)| 1;
//控制台日志(intId);
var fieldWrapper=$(“”);
fieldWrapper.data(“idx”,intId);
变量fName=$(“”);
var fType=$(“”);
//var fType=$(“checkedText段落”);
//var removeButton=$(“”+intId+“”);
//移除按钮。单击(函数(){
//$(this.parent().remove();
// });
//控制台日志(intId);
控制台日志(intId);
var removeButton=$(“.remove”)
移除按钮。单击(函数(){
控制台日志(intId intId);
//$(“#buildyourform div:last child”).remove()
//$(“#字段”+intId).remove();
//$(“#字段”+intId).remove();
});
fieldWrapper.append(fName);
fieldWrapper.append(fType);
fieldWrapper.append(intId);
$(“#buildyourform”).append(fieldWrapper);
})
当多次在删除按钮上生成div时,单击它必须删除最后一个div,然后添加新div应具有当前最后一个div的一致div id

创建一个字符串堆栈或数组,保留动态元素的id,写一个方法来删除最近的元素使用保存动态元素id的堆栈或数组来获取最近添加的元素的id,然后像这样单击remove elelment by id


你修好了吗?移除按钮在哪里!?如果您发现答案正确,请接受或发表评论是找到答案只需将删除按钮单击事件移出添加按钮事件
$('#addairdata').on('click', function (event) {
    event.stopPropagation();
    event.preventDefault(); 
    var lastField = $("#buildyourform div:last");
    var intId = (lastField && lastField.length && lastField.data("idx") + 1) || 1;
    // console.log(intId);
    var fieldWrapper = $("<div class=\"fieldwrapper input-group input-group-sm mb-3 overflow-auto\" id=\"field" + intId + "\"/>");
    fieldWrapper.data("idx", intId);
    var fName = $("<input type=\"number\" class=\"fieldname col-6 form-control\" id=\"af" + intId + "\"/>");
    var fType = $("<input type=\"number\" class=\"fieldtype col-4 form-control\" id=\"sp" + intId + "\" />");

    // var fType = $("<select class=\"fieldtype\"><option value=\"checkbox\">Checked</option><option value=\"textbox\">Text</option><option value=\"textarea\">Paragraph</option></select>");
    // var removeButton = $("<button type=\"button\" class=\"col-2 btn btn-sm btn-outline-primary float-right\" disabled>"+intId+"</button>");
    // removeButton.click(function() {
    //     $(this).parent().remove();
    // });
    // console.log(intId);

    console.log(intId);


    var removeButton = $(".remove")

    removeButton.click(function() {

        console.log(intId-intId);
        // $("#buildyourform div:last-child").remove()
        // $("#field"+intId).remove();   
        // $("#field"+intId).remove();
    });
    fieldWrapper.append(fName);
    fieldWrapper.append(fType);
    fieldWrapper.append(intId);
    $("#buildyourform").append(fieldWrapper);

})
function removeElement(id) {
    var elem = document.getElementById(id);
    return elem.parentNode.removeChild(elem);
}