如何在jquery中重新分配id

我通过jquery动态生成元素，并为每个元素创建动态id。 现在，我还提供了通过移除按钮移除特定元素的功能。 在这种情况下，给定元素的id也会被删除。 现在我必须重新分配所有id，以便所有id都按顺序排列

例如。 假设我通过jquery动态生成4个div

<div id="box1"></div>
<div id="box2"></div>
<div id="box3"></div>
<div id="box4"></div>

现在我移除第二个

<div id="box1"></div>
<div id="box3"></div>
<div id="box4"></div>

我的身份证现在是1号框，3号框，4号框

---

但是我希望它们是box1、box2和box3

每次卸下一个盒子时都尝试一下

var $boxes = $('[id^="box"]');
for (var i = 0; i < $boxes.length; i++) {
    $boxes.eq(i).prop('id', 'box' + (i + 1));
}

---

执行类似操作，为所有div创建一个公共类

<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>

这是JSFIDLE，如果必须使用顺序ID，最简洁的实现是（假设每个框都有一个共同的类

box

）：

另一种实施方式是：

$('.box').attr('id', function(i) {
    return 'box' + (i + 1);
});

但这并不像在

.attr

将运行的循环中创建额外的jQuery对象那样高效

---

但是，最好不要使用顺序id—您通常可以在需要时使用

.index（）

在其父项中查找子项的位置。

捕获当前删除项的id

例如，如果您要删除某个按钮上的某个项目，请单击id为

#btn

的按钮，然后：

$('#btn').click(function(e)

{
 var elemid=($('#box2').attr('id')).split(""); //elemid will be ["b","o","x","2"]

 var id=new Array(); //var id type is array because in case removed item's id contains more than one digit number like box22, box31, box49..

 for(var i=0; i<elemid.length;i++)

 {
   if(!isNaN(parseInt(elemid[i])))
   {
     id.push(elemid[i]); //extract all numbers and push them into id array
   }
 }

  id=parseInt(id.join("")); //join id array contents and change them from string to number

 var parent=$('#box2').parent();

 var pos=$(#box2).index();  //position from where to start changing id(s)

 $('#box2').remove();

 var k=0;

 parent.children('div').each(function(){

    if(k>=pos){
        $(this).attr('id','box'+id)

         id++;
    }
    k++;
  })
})

$（'#btn'）。单击（函数（e）
{
var elemid=（$（'#box2'）.attr（'id'））.split（“”；//elemid将是[“b”、“o”、“x”、“2”]
var id=new Array（）；//var id类型为Array，因为如果删除的项的id包含多个数字，如box22、box31、box49。。
对于（变量i=0；i=pos）{
$（this.attr（'id'，'box'+id）
id++；
}
k++；
})
})

嗯，为什么？你不能把它们放在一个名为

box

的容器中，然后只

getElementById（'box'）。孩子们[你的号码在这里]

？我同意@NiettheDarkAbsol，增量

id

或

class

属性会导致维护噩梦-尤其是当它们必须有序时。实际上，我不想通过id获取任何元素。这很容易做到。但由于这些ID在某些数据库的表中使用，因此如果缺少ID，那么表中的所有位置都将被删除empty@pdjinn如果你不需要“获取任何元素”，那么你就不需要给元素一个ID。只需在迭代元素时使用元素的索引来确定它们的位置。对不起。。。但是后端人员正在某些数据库的表中使用ID，他们希望它是连续的，因为某些表problem@NiettheDarkAbsol啊，在这里，添加了.eq（）仍然是一个可怕的解决方案：p

$（this）.attr（'id'，'string'）

是一个jQuery反模式问题问到了，这里正在做的事情在我看来是反模式的，我只是在回答这个问题，因为我没有足够好的信息来建议更好的选择。实际上，我需要顺序ID用于后端目的。

$('.box').each(function(i) {
    this.id = 'box' + (i + 1);
});

$('.box').attr('id', function(i) {
    return 'box' + (i + 1);
});

$('#btn').click(function(e)

{
 var elemid=($('#box2').attr('id')).split(""); //elemid will be ["b","o","x","2"]

 var id=new Array(); //var id type is array because in case removed item's id contains more than one digit number like box22, box31, box49..

 for(var i=0; i<elemid.length;i++)

 {
   if(!isNaN(parseInt(elemid[i])))
   {
     id.push(elemid[i]); //extract all numbers and push them into id array
   }
 }

  id=parseInt(id.join("")); //join id array contents and change them from string to number

 var parent=$('#box2').parent();

 var pos=$(#box2).index();  //position from where to start changing id(s)

 $('#box2').remove();

 var k=0;

 parent.children('div').each(function(){

    if(k>=pos){
        $(this).attr('id','box'+id)

         id++;
    }
    k++;
  })
})