Html jQuery拖动排序插件_div拖动效果并保存到后台

本Demo主要是实现div拖动排序的效果、使用插件jquery.sortable完成的、通过jquery的Sortable函数实现的div的拖动排序效果、可实现与后台的交互、主要应用在一些需要用户自定义排序的地方、Demo运行效果如下

HTML代码

<section id="intro">
	<h1>拖动排序</h1>
</section>
<section>
<ul class="gbin1-list">
	<li>jQuery</li>
	<li>javascript</li>
	<li>HTML5</li>
	<li>CSS3</li>
</ul>

<div style="clear:both" id="msg"></div>

</section>

JS代码

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.sortable.js"></script> 
<script type="text/javascript">
$(´.gbin1-list´).sortable().bind(´sortupdate´, function() {
	$(´#msg´).html(´已变换位置´).fadeIn(200).delay(1000).fadeOut(200);
});
</script>

最后给贴上Demo的源代码、希望对大家有用、有兴趣的哥们可以下载看看

源代码下载链接: http://dwtedx.com/download.html?bdkey=s/1jGxlkVk 密码: ksrz