Question

如果我没有充分解释这一点，请告诉我，因为我只是在思考它而感到困惑。

我可以点击一个显示“添加产品”的按钮，并让它每次都创建一个独特的div。例如，第一个div的id为＃product1，然后是#product2 etc.

真正棘手的部分是div中有两个输入字段，都是常规文本输入。这些也需要有唯一的ID，以便我可以使用它们中的内容。

如果您有任何解决方案，请告诉我。谢谢，卡森

Answer 1

您可以使用递增ID变量，如下所示：

var i = 1;
$("#addProduct").click(function() {
  $("<div />", { "class":"wrapper", id:"product"+i })
     .append($("<input />", { type: "text", id:"name"+i }))
     .append($("<input />", { type: "text", id:"property"+i }))
     .appendTo("#someContainer");
  i++;
});

You can give it a try here，这是一个非常一般的答案，但你明白了，只需在每次添加项目后增加变量。

Answer 2

确定。这是一个非常古老的帖子，但我认为如果你有类似的问题可能会有所帮助。我在jQuery（see here）中遇到了.uniqueId（）。

它检查元素是否已经具有id，如果没有，则为其分配唯一ID。缺点是您不能拥有“自定义ID名称”（例如product_1，product_2等）。分配的id类似于ui-id-1，ui-id-2等。

要分配唯一ID，您可以这样 -

$("<div class='someDivConntet'></div>").insertAfter($(this)).uniqueId();

请确保您已经没有在元素上设置ID。

Answer 3

$(function(){
    var pcount = icount = 0;

    $('<div/>', {
       id:   'product' + pcount++
    }).append($('<input/>', {
       id:   'input' + icount++
    })).append($('<input/>', {
       id:   'input' + icount++
    })).appendTo(document.body);
});

Answer 4

通常，您不需要以这种方式使用ID。

使用Javascript创建新元素后，您已经拥有了一个可以传递给函数等的对象。您当然不需要传递ID就可以将它传递给{{ 1}}

Answer 5

我正在使用我已经制作的

$.fn.uniqueId = function(idlength){
    var charstoformid = '_0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz'.split('');
    if (! idlength) idlength = 10;

    var getId = function() {
        var uniqid = '';
        for (var i = 0; i < idlength; i++) {
            uniqid += charstoformid[Math.floor(Math.random() * charstoformid.length)];
        }
        return uniqid;
    }

    return $(this).each(function(){
        var id = getId()

        while ( $("#"+id).length ) {
            id = getId();
        }
        $(this).attr("id", id);         
    });
}

它具有生成随机字符链的功能，然后确保生成的字符串是唯一的（具有0,000001％的可能性 - 但它可能），然后更改id。

Answer 6

你可以使用Just increase变量和append创建独特的DIV ID代码就像Bellow

一样

var x = 1;
var wrapper = $('.field_wrapper'); //Input field wrapper your div Add in this Class


var fieldtext = '<div ID="product_'+x+'"><label id="label_'+x+'" for="field_'+x+'"></label><input type="text" id="field_'+x+'" name="field_'+x+'" value=""/></div>'; //New input field html 

$(wrapper).append(fieldtext); // Add field html
x++;

使用唯一ID创建动态div - jQuery

6 个答案: