我們今天這個(gè)例子是基于droppable里的simple photo manager做出來的。。。
這個(gè)代碼，我們用來實(shí)現(xiàn)拖動(dòng)，cancel表示對(duì)于樣式名為ui-icon的元素就不可以拖動(dòng)，而revert表示可以返回，containment表示我們的拖動(dòng)只能基于當(dāng)前文檔，helper那里，其實(shí)可以寫上拖動(dòng)的地方，但我們這里表示復(fù)制。。
這個(gè)表示我們的購物車允許放東西，accept表示的是從id為gallery里來的li，拖動(dòng)進(jìn)來后就加上樣式名ui-state-highlight，放的時(shí)候有一個(gè)function drop，記得把參數(shù)寫上去。。
關(guān)于deleteImage這一塊，我們做了修改。。
我們?cè)谕蟿?dòng)時(shí)，用clone來實(shí)現(xiàn)復(fù)本，這樣更符合我們?cè)谏坛抢锏睦樱瑢?duì)于end函數(shù)，我在JQ API里得知，它表示事件結(jié)束，返父節(jié)點(diǎn)，比如上面的就是說又從$(this)開始。。。
你們可以看到，我們的計(jì)費(fèi)，是采用each這個(gè)函數(shù)來實(shí)現(xiàn)的，toFixed(2)用來表示我們保留兩位小數(shù)。。。
這里是購物車的刪除功能，同樣，我們也是采用each來實(shí)現(xiàn)刪除計(jì)價(jià)，我在百度上看到許多人的做法是通過個(gè)數(shù)的減少，再乘以單價(jià)實(shí)現(xiàn)自動(dòng)計(jì)價(jià)的，我們也差不多，也就是判斷商品個(gè)數(shù)，實(shí)現(xiàn)計(jì)價(jià)。。。
這是我們用來實(shí)現(xiàn)彈窗放大效果的代碼，當(dāng)然了，這是jquery ui的另一個(gè)功能，因此，這個(gè)購物車，包含了jquery ui的幾個(gè)重要功能，拖放，彈窗。。。
大家提出加上清空購物車，我就加多一個(gè)功能啦。。。
以下是我制作的效果截圖：
