jquery UI draggable学习

jquery UI组件中的draggable是个很强大的工具，能够对元素进行各种方式的拖动。在其官网http://jqueryui.com/demos/draggable/上只是对一些参数和事件进行了介绍，没有具体的例子进行说明。下面我就对平常使用率较高的一些选项进行讲解：

1.axis:设置拖动的方向，值有‘x’,'y'两个。x表示在水平位置上拖动，y表示在垂直方向上拖动。

2.cancel：设置禁止在某个元素上拖动。这个参数可以对一些元素进行选择性的拖动，也可以对元素进行循环拖动和停止拖动。

3.containment：限制在什么框架中拖动。常用的值为parent，限制只能在父系框架中拖动。对于由多个div组成的一个框架，可以使用这个参数限制拖动的范围只能在父框架中而不影响这个父框架中之外的元素。

4.connectToSortable:这个参数可以和jquery UI中的sortable结合使用。顾名思义，拖动相关元素可以进行排序以调整元素之间的位置。

5.drag事件：在拖动过程中，设置的回调函数会被调用。所以我们可以在这个回调函数中进行一些相关元素的处理，比如拖动时对一些元素的颜色和亮度进行调整，以达到一种忽明忽暗的效果。

6.start事件：开始拖动时触发的事件。可以再这个事件中对一些只需要在拖动过程中展现的数据进行初始化，不用一打开网页就初始化这些数据，以减轻数据库的压力。

7.stop事件：和start事件相反，结束拖动动作触发的事件。当然可以在这个事件中将一些多余的数据进行清除。

暂时能在应用中常用的一些参数和方法就是这些，以后会根据需求的变化增加和删减一些参数。技术永远是排在第二的，业务才是第一位的。有了业务才能确定技术。