javascript初学者です。
以下のコードで動くようにはなったのですが、非常に不恰好です。助言いただけないでしょうか?
###動いているコード
javascript
1$("#sortable li").on('click',function(){ 2 $(this).detach(); 3 $(this).appendTo('#deleteList'); 4 5 $('#deleteList li').on('click',function(){ 6 $(this).detach(); 7 $(this).appendTo('#sortable'); 8 $("#sortable li").on('click',function(){ 9 $(this).detach(); 10 $(this).appendTo('#deleteList'); 11 }); 12 }); 13 });
###やりたいこと
1.要素を削除
2.削除した要素を元に戻す
3.戻された要素も削除できるようにする
4.(できれば)戻す位置を削除した時の位置へ
###上記コードでできている範囲
1,2,3はできていますが、4はできていません。
.after()
や.before()
を使うとできるようですが、参考になるサイトがなく、困っています。
###補足
上記コードをスッキリさせるために、以下を試しました。
しかし、1はできても2以降ができません。
javascript
1$(function() { 2 $("#sortable li").on('click',function(){ 3 $(this).detach(); 4 $(this).appendTo('#deleteList'); 5 }); 6 7 $('#deleteList li').on('click',function(){ 8 $(this).detach(); 9 $(this).appendTo('#sortable'); 10 }); 11 });
###追記
以下のようなコードにして試してみました。
要素は非表示になるのですが、#sortable
に要素が追加されません。
javascript
1$(function() { 2 $('#unList li').on('click',function(){ 3 $(this).remove(); 4 $('#sortable').append($(this).clone().addClass("ui-sortable-handle")); 5 }); 6 7 $("#sortable li").on('click',function(){ 8 $(this).remove(); 9 //$(this).appendTo('#unList'); 10 $('#unList').append($(this).clone().removeClass("ui-sortable-handle")); 11 }); 12 });

回答2件
あなたの回答
tips
プレビュー