Jquery- 动态添加字段 - 防止删除最后一个项目

Jquery- Dynamic added fields - prevent the last Item to be removed

本文关键字：删除 最后一个 项目 动态 添加 字段 Jquery-      更新时间：2023-09-26

我有一个动态复制/删除的表单字段

在这里看小提琴：http://jsfiddle.net/obmerk99/y2d4c/6/

在此功能中，我还需要增加字段的 NAME（和 ID 等），如下所示：

o99_brsa_settings[brsa_dash_wdgt_content][0]
o99_brsa_settings[brsa_dash_wdgt_content][1]
o99_brsa_settings[brsa_dash_wdgt_content][2] ...
它

正在工作，但问题是当我添加/删除字段时，当它到达最后一个（实际上是第一个）时，它会给我"未定义"并且不会再添加字段。

要查看问题，您需要"播放"一下添加/删除。

我相信主要问题是如果我们有 [0] 和 [0][2] 如何将所有这些保持在相同的数组级别

我离JS大师还很远，这段代码以某种方式是从各种来源组装的。但是我现在有点卡住了，所以任何帮助将不胜感激。

试试这个方式：

$(function () {
    $(".addScnt").on("click", function () {
        var i = checkNumberOfElements();
        var scntDiv = $("div[id^='widget_dup']:last");
        var prevDiv = scntDiv.clone();
        var newname = $(prevDiv).find("textarea").attr("name").substring(0, $(prevDiv).find("textarea").attr('name').indexOf(']'));
        prevDiv.find('textarea').attr('name', newname + "][" + i + "]");
        prevDiv.find('textarea').attr('id', newname + "][" + i + "]");
        prevDiv.find('label').attr('for', newname + "][" + i + "]");
        prevDiv.attr('id', $(prevDiv).attr('id') + "_" + i);
        $(scntDiv).after(prevDiv);
    });
    $(document).on("click", ".remScnt", function (event) {
        var i = checkNumberOfElements();
        if (i <= 1) {
            return false;
        } else {
            var target = $(event.currentTarget);
            target.parent("div").remove();
        }
    });
});
function checkNumberOfElements() {
    // Number of textareas
    var i = $("textarea[name^='o99_brsa_settings[brsa_dash_wdgt_content]']").length;
    // Number of divs
    // var i = $("div[id^='widget_dup']").length;
    if (typeof i === undefined) {
        return 0;
    } else {
        return i;
    }
}

演示：http://jsfiddle.net/y2d4c/7/

相关文章：