创建具有唯一ID的动态div - jQuery [英] Create Dynamic div with unique IDs - jQuery

问题描述

如果我没有足够解释这个问题，让我知道，因为我只是想想这件事情让我感到困惑。

我可以点击按钮，说添加产品，并让它每次创建一个唯一的div。例如，第一个div将具有id＃product1，然后是＃product2等。

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

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

解决方案

您只需使用增量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 ++; 
}）; 
  

你可以试试这里，这是一个非常一般的答案，但你得到这个想法，只要在每次添加你的项目后增加变量。

Let me know if I'm not explaining this well enough as I'm confusing myself just thinking about it.

I was to be able to click on a button that says "add product" and have it create a unique div each time. For example, the first div would have the id #product1, then #product2 etc.

The really tricky part is to have two input fields in the div, both regular text inputs. These also need to have unique IDs so I can use what is placed in them.

Let me know if you have any solutions. Thanks, Carson

解决方案

You can just use an incrementing ID variable, like this:

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, this is a very general answer, but you get the idea, just increment the variable after adding your items each time.

这篇关于创建具有唯一ID的动态div - jQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！