如何交換兩個div標籤？

Question

我想完全交換兩個html div標籤，標籤和所有標籤。我嘗試了代碼下面的代碼，但它不起作用。

jQuery('#AllBlock-'+Id).insertAfter('#AllBlock-'+Id.next().next()); 

如何完全交換兩個div標籤。

Answer 1

你不能這樣做，因爲你不能連接一個字符串和一個jQuery對象。

試試這個：

var div = $('#AllBlock-'+Id); 
div.insertAfter(div.next().next()); 

Answer 2

它應該是這樣的

應關閉標識後支架，

jQuery('#AllBlock-'+Id).insertAfter('#AllBlock-'+Id).next().next()); 

Answer 3

您需要先卸下現有的DOM對象，然後再使用它：

$('#divid').detach().insertAfter('#someotherdivid'); 

Answer 4

你有一些支架在你的代碼不匹配，它看起來像你可能會試圖做到這一點：

jQuery('#AllBlock-'+Id).insertAfter($('#AllBlock-'+Id').next().next());

這將需要類似：

<div id="AllBlock-5"></div> 
<div id="AllBlock-6"></div> 
<div id="AllBlock-7"></div> 

而且，如果調用標識5，把它變成這樣：

<div id="AllBlock-6"></div> 
<div id="AllBlock-7"></div> 
<div id="AllBlock-5"></div> 

這是因爲你服用塊5，和移動它（用insertAfter）的PL這是next().next()塊後ACE（或下，但一）從本身，這將是塊7

如果你想永遠掉#AllBlock-Id與#AllBlock-[Id+2]，所以他們交換位置，並最終像下面這樣：

<div id="AllBlock-7"></div> 
<div id="AllBlock-6"></div> 
<div id="AllBlock-5"></div> 

你可能也想嘗試：

var $block = jQuery('#AllBlock-'+Id); 
var $pivot = $block.next(); 
var $blockToSwap = $pivot.next(); 
$blockToSwap.insertBefore($pivot); 
$block.insertAfter($pivot); 

Answer 5

我的理解是要在與最後一個div點擊換一個div。如果它是最後一個div，你會怎麼做？移動到頂部？

此解決方案應該解決問題，此外，您可以修改此正則表達式以匹配您的ID的格式。這可能會變得更加簡潔和強大。例如，您可以更復雜一點地獲取最後一個ID。這可能只是修改選擇器或更多。我的意思是，你不想重新排列頁腳，或者僅僅因爲它是頁面上的最後一個div。

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

//set regex 
var re = /(^\w+-)(\d+)$/i; 

//get attr broken into parts 
var str = $(this).attr('id').match(re)[1], 
    id = $(this).attr('id').match(re)[2]; 


//get div count and bulid last id 
var lastStr = $('div:last').attr('id').match(re)[1], 
lastID = $('div:last').attr('id').match(re)[2]; 


//if we have any div but the last, swap it with the end 
if (id !== lastID) { 
     $(this).insertAfter('#'+lastStr+lastID); 
} 

//otherwise, move the last one to the top of the stack 
else { 
    $(this).insertBefore('div:first'); 
} }); 

看看這個工作提琴：http://jsfiddle.net/sQYhD/

您還可能有興趣在jQuery的UI庫：http://jqueryui.com/demos/sortable/