拖曳外掛draggable的功能是拖動被繫結的元素，當這個jQuery UI外掛與元素繫結後，可以通過呼叫draggable()方法，實現各種拖曳元素的效果，呼叫格式如下：

$(selector). draggable({options})

options引數為方法呼叫時的配置物件，根據該物件可以設定各種拖曳效果，如“containment”屬性指定拖曳區域，“axis”屬性設定拖曳時的座標方向。

例如，在頁面中的<div>元素中新增兩個子類<div>，通過與拖曳外掛繫結，這兩個子類<div>元素只能在外層的父<div>元素中任意拖曳，如下圖所示：

在瀏覽器中顯示的效果：

從圖中可以看出，由於使用jQuery UI外掛draggable綁定了兩個子類<div>元素，並將配置物件的“containment”屬性值設為“parent”，因此，這兩個子類<div>元素只能在外層的父框中實現任意拖曳。

還有很多其他的引數可以設定：

addClasses: 設定是否新增ui-draggable樣式.
appendTo: 設定追加到什麼地方
axis: 設定拖動的方向
cancel, handle: 設定控制整個控制元件拖動動作的區域, cancel指定區域不能拖動, handle指定區域控制控制元件拖動.
connectToSortable: 需要和sortable整合.