jQuery实现容器间的元素拖拽功能

在html中准备三个容器

	

		
A
		
B
		
C
		
e
		
f
		
g
	
	

	

在css中，给容器写上样式相应的样式

.container ul{
   width: 350px;
   padding: 15px;
   min-height:300px;
   background-color:#FFFFF0;
   margin:20px;
   display: inline-block;
   border-radius: 5px;
   border: 1px solid #C6C8CA;
 }
 .container ul li{
  display: block;
  float: left;
  width: 350px;
  height: 35px;
  line-height: 35px;
  border-radius: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  background-color:yellow;
  margin-bottom:10px;
  -moz-user-select: none;
  user-select: none;
  text-indent: 10px;
  color: #555;
}

js代码
首先引用jquery的js文件

在script的标签中，开始写js代码。

最后实现的效果如下：