无法使用JavaScript/jQuery为文本字段创建唯一id

我正在使用按钮单击创建多个文本字段，但无法为每个字段创建唯一的id。这是我的密码：

<div class="form-group" id="intro-box">
    <input type="text" style="width:85%;float:left;margin-bottom:5px;" class="form-control" id="introlabelname0" name="introlabelname" placeholder="Label Name" value="">
    <input type="button" class="btn btn-success btn-sm" name="plus" id="plus" value="+" style="font-size:21px; line-height:12px; border-radius:4px; margin:3px; margin-bottom:6px;" onclick="addMore(1);">
  </div>
  <script>
    function addMore(i) {

      $("#plus").remove();

      $('#intro-box').append('<div><input type="text" style="width:85%;float:left; margin-bottom:5px;" class="form-control" id="introlabelname' + i + '" name="introlabelname" placeholder="Label Name" value="">' +
        '<input type="button" onclick="removeThis(' + i + ');" class="btn btn-danger btn-sm" name="minus" id="minus' + i + '" value="-" style="font-size:21px; line-height:12px; border-radius:4px; margin:3px; margin-bottom:6px;"></div>' +
        '<div> <input type="button" class="btn btn-success btn-sm" name="plus" id="plus" value="+" style="font-size:21px; line-height:12px; border-radius:4px; margin:3px; margin-bottom:6px;" onclick="addMore(' + (i++) + ');"></div>');
    }

    function removeThis(j) {
      $("#introlabelname" + j).remove();
      $("#minus" + j).remove();
    }
  </script>

最初id是introlabelname0，而多个字段将创建它，它应该类似于introlabelname1，introlabelname2。。。等等类似地，当用户单击-按钮时，所有ID也应该像introlabelname0、introlabelname1、introlabelname2一样依次出现

这是我的总数。

保存一个可变的总数，并使用它来了解您有多少输入：

var total = 0;
function addMore(i) {
  total++;
  $("#plus").remove();

  $('#intro-box').append('<div><input type="text" style="width:85%;float:left; margin-bottom:5px;" class="form-control" id="introlabelname' + total + '" name="introlabelname" placeholder="Label Name" value="">' +
    '<input type="button" onclick="removeThis(' + i + ');" class="btn btn-danger btn-sm" name="minus" id="minus' + i + '" value="-" style="font-size:21px; line-height:12px; border-radius:4px; margin:3px; margin-bottom:6px;"></div>' +
    '<div> <input type="button" class="btn btn-success btn-sm" name="plus" id="plus" value="+" style="font-size:21px; line-height:12px; border-radius:4px; margin:3px; margin-bottom:6px;" onclick="addMore(' + (i++) + ');"></div>');
}

试试这个-

<script>
    var a = 0;
    function addMore(i) {

        a = a + 1;

        i = a;

        $("#plus").remove();

        $('#intro-box').append('<div><input type="text" style="width:85%;float:left; margin-bottom:5px;" class="form-control" id="introlabelname' + i + '" name="introlabelname" placeholder="Label Name" value="">' +
        '<input type="button" onclick="removeThis(' + i + ');" class="btn btn-danger btn-sm" name="minus" id="minus' + i + '" value="-" style="font-size:21px; line-height:12px; border-radius:4px; margin:3px; margin-bottom:6px;"></div>' +
        '<div> <input type="button" class="btn btn-success btn-sm" name="plus" id="plus" value="+" style="font-size:21px; line-height:12px; border-radius:4px; margin:3px; margin-bottom:6px;" onclick="addMore(' + (i++) + ');"></div>');
    }

    function updateIds(){
        var textboxElements = $('#intro-box input:text');

        for(var j = 0; j < textboxElements.length; j++) {
            $('#intro-box input:text')[j].id = "introlabelname" + j;
            console.log($('#intro-box input:text')[j].id);
        }

    }

    function removeThis(j) {
        $("#introlabelname" + j).remove();
        $("#minus" + j).remove();
        updateIds();
    }
</script>

---

您可以使用如下函数：

function generateUID(){
    return Math.floor(Math.random() * 100 * Date.now());
}

这将返回一个随机数。使用它来构造元素，也可以使用元素的索引。但是每次查询元素都会消耗资源。

在中查找答案，而不是动态创建DOM我克隆了它。实现同样的目标有多种方法

函数初始化{ $'input[type=text].form控件'.eachfunctioni{ $this.removeAttr'id'，.attr'id'，introlabelname'+i； }; $'.减号'.show.last.hide； $'.plus'.hide.last.show； } 函数addMorei{ $'.input wrap'.first.clone.appendTo'intro-box'； 初始化； } 功能删除{ $el.closest'.input wrap'.remove； 初始化； } 初始化； 你好

---

我不明白你为什么需要索引和索引。附言：你不需要它，除非你需要唯一的表单动作元素名称。。。但我看不到表单…它将帮助轻松提取循环中的所有文本字段值。@gkb:但是当用户删除文本框时，其余文本框的ID也将连续出现。但这里不会发生这样的事，你能帮我一下吗。