を最大数と見えるのdivを削除し、横にあるdiv要素を追加し、thatsの。 ...そうでなければ、それを歩かなければならないでしょう。
これを解決するにはいくつかの方法があります。クローンを挿入してクローンを挿入し、次のインデックスを移動することができます。
または、保存配列に戻すことができます。
jQuery(function() {
var save = $('.special').detach();
$('.add').click(function() {
save.eq(0).appendTo(".targetdiv");
save = save.filter(function(i) { return i; });
\t \t \t \t \t
});
$('.remove').click(function() {
save.push($('.special').last().detach()[0]); //Add it back to the array
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<button class="add">add</button>
<button class="remove">remove</button>
<div class="targetdiv">
<div class="special">div 1</div>
<div class="special">div 2</div>
<div class="special">div 3</div>
<div class="special">div 4</div>
<div class="special">div 5</div>
<div class="special">div 6</div>
</div>
この1つは順序を保持します：
jQuery(function() {
var osave = $('.special').detach();
var save=[]
for(i=0;i<osave.length;i++){
save[i]=osave[i]; //Fix key reference
}
$('.add').click(function() {
//get the first index of the array
index=Object.keys(save).sort()[0];
console.log(save,index);
$(save).eq(index).appendTo(".targetdiv");
save.splice(index,1); //truly remove from save
//save = save.filter(function(i) { return i; });
\t \t \t \t \t
});
$('.remove').click(function() {
//How many are visible?
vis=$('.special').length-1;
save[vis]=($('.special').last().detach()[0]); //Add it back to the array with the right index.
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<button class="add">add</button>
<button class="remove">remove</button>
<div class="targetdiv">
<div class="special">div 1</div>
<div class="special">div 2</div>
<div class="special">div 3</div>
<div class="special">div 4</div>
<div class="special">div 5</div>
<div class="special">div 6</div>
</div>
これが動作する方法は、それが保存するようにキーを割り当ててあり、このよう 参照を保持できることを確認してから、それをtに追加する彼は文書化し、それを保存から取り除く。ドキュメントから削除すると、正しいインデックスで保存するために追加されます。
より良いバージョン：
jQuery(function() {
var osave = $('.special').detach();
var save=[]
for(i=0;i<osave.length;i++){
save[i]=osave[i]; //Fix key reference
}
$('.add').click(function() {
//get the first index of the array
//index=Object.keys(save).sort()[0];
index=$('.special').length;
$(save).eq(index).appendTo(".targetdiv");
//Dont remove from save.
//save = save.filter(function(i) { return i; });
\t \t \t \t \t
});
$('.remove').click(function() {
$('.special').last().detach()[0]; //Add it back to the array with the right index.
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<button class="add">add</button>
<button class="remove">remove</button>
<div class="targetdiv">
<div class="special">div 1</div>
<div class="special">div 2</div>
<div class="special">div 3</div>
<div class="special">div 4</div>
<div class="special">div 5</div>
<div class="special">div 6</div>
</div>
この1つは、保存変数を管理していない、だけで何も順序から外れていないと仮定すると、現在表示されて何を見てインデックスを管理します。
私は最後の方をお勧めしますが、回答者には何かが必要な場合は、回答者に回答を残しておきます。
あなたがしようとしていることについてさらに説明してください。 –
もう少し簡単なアプローチは、そのコレクションを配列に変換し、その方法を操作することです。ここでは、謎です：http://jsfiddle.net/zWkxt/11/ –