本文介绍了动态重新排序5个div的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
动态重新排序5个div ...现在我可以使用jquery在两个div之间交换....我想按照愿望重新排序div ...例如,如果有5个div作为div1,div2,div3 ,div4,div5等我必须能够重新定位任何顺序(div4,div3,div2,div5,div1等或div3,div2,div5,div4,div1等).....我试过很多javascript提到但没有工作....最早提供正确的完整代码..
使用的代码:
Reorder 5 divs dynamically...Right now i am able to swap between two divs using jquery....I want to reorder divs as per wish...For instance if there are 5 divs as div1,div2,div3,div4,div5 etc i must be able to reposition as any order (div4,div3,div2,div5,div1 etc or div3,div2,div5,div4,div1 etc).....I tried many javascript mentioned but none worked....Provide a correct complete code at the earliest..
Code used:
script src="jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="jquery-Swapies.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".go-swap").click(function () {
var div1 = document.getElementById("<%=Hiddendiv1.ClientID %>").value;
var div2 = document.getElementById("<%=Hiddendiv2.ClientID %>").value;
$(div1).swap({
target: div2, // Mandatory. The ID of the element we want to swap with
opacity: "0.5", // Optional. If set will give the swapping elements a translucent effect while in motion
speed: 1000, // Optional. The time taken in milliseconds for the animation to occur
});
});
});
</script>
<div id="div_1" runat="server">THIS IS DIV 1</div>
<div id="div_2" runat="server">THIS IS DIV 2</div>
<div id="div_3" runat="server">THIS IS DIV 3</div>
<div id="div_4" runat="server">THIS IS DIV 4</div>
<div id="div_5" runat="server">THIS IS DIV 5</div>
<asp:HiddenField ID="Hiddendiv1" runat="server" />
<asp:HiddenField ID="Hiddendiv2" runat="server" />
<asp:Button ID="Button1" runat="server" Text="Select Divs"
onclick="Button1_Click" />
<asp:Button ID="btnsubmit" runat="server" class="go-swap" Text="Submit" OnClientClick="return false;" />
推荐答案
这篇关于动态重新排序5个div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!