1

我希望有人能在这里帮忙。我有一堆 div 类 '.my-div-1'、'.my-div-2'、'.my-div-3' 等。我在每个 div 内都有一个按钮，单击该按钮会删除此 div . 我想从那里做的是更新所有正在进行的 div 类。因此，如果我删除 div 类为 '.my-div-2' 的下一个 div '.my-div-3' 将变为 '.my-div-2'，之后的下一个 '.my- div-4'，会变成 '.my-div-3' 等等。

我现在设置它的方式是使用 .nextAll() 删除旧类并添加新类，并带有动态更新编号。但是，这仅适用于下一个，并且动态数字对于以后的 div 不会增加。我不确定 nextAll 是否可以这样做，可能有更好的方法。关于如何实现这一目标的任何想法？任何帮助，将不胜感激。

编辑 - 我还应该提到每个 div 还混合了我需要保留的其他类。

HTML 是：

<div class="my-div-container">
   <div class="myDiv my-div-1"></div>
   <div class="myDiv my-div-2"></div>
   <div class="myDiv my-div-3"></div>
   <div class="myDiv my-div-4"></div>
</div>

和点击事件中的jQuery：

var divIndex = $(this).parents('.myDiv').prevAll().length;      

$(this).parents('.myDiv').nextAll().removeClass('my-div-'+(divIndex+1)).addClass('my-div-'+(divIndex));
$(this).parents('.myDiv').remove();
4

2 回答 2

3

为什么不重新计算所有 div 的类值？

例子

JS

$('span').click(function(){

    $(this).closest('.myDiv').remove(); 

    $('.myDiv').each(function(i){
        var div = $(this); 
        var cls = div.attr('class'); 
        div.attr('class', cls.replace(/my\-div\-[0-9]/, 'my-div-' + (i+1)));
    }); 
}); ​

HTML

<div class="my-div-container">
    <div class="myDiv my-div-1"><span>Test</span></div>
   <div class="myDiv my-div-2 someotherclass"><span>Test</span></div>
   <div class="myDiv my-div-3 test"><span>Test</span></div>
   <div class="myDiv my-div-4"><span>Test</span></div>
</div>​
于 2012-11-09T00:45:18.190 回答
1

这是我的解决方案：

​$('.myDiv').click(function()
{
  var index = $(this).index() + 1;
  $(this).nextAll().each(function(innerIndex)
  {                                               
    $(this).removeClass('my-div-' + (index + innerIndex + 1)).addClass('my-div-' + (index + innerIndex )); 
  });
  $(this).remove();
});​​​​​​​​​​​
于 2012-11-09T00:54:46.737 回答