在JQuery UI中，當項目在可放置區域之間拖動時，如何減少計數？

Question

我正在使用JQuery UI 1.8.3，請參見下圖以了解我的頁面設置。
我正在計算拖動到可放置區域的項目數，但是當我將項目從A拖到B時，該計數是不正確的。例如，如果我將項目1拖到框A，則框A的計數（＃）變為1，但是如果我將項目1從A拖到B，則框A的計數仍為1，但我需要將其遞減為0。

  +------------------------+      +-----------------------+
  | Items (Dragable items) |      | A (Droppable Area)  # |
  |------------------------|      |-----------------------|
  |  item 1                |      |                       |
  |  item 2                |      |                       |
  |  item ...              |      +-----------------------+
  |  item n                |
  |                        |      +-----------------------+
  |                        |      | B (Droppable Area)  # |
  |                        |      |-----------------------|
  |                        |      |                       |
  |                        |      |                       |
  +------------------------+      +-----------------------+

我的代碼如下所示刪除項目：

$(".dropArea").droppable({
    ...
    drop: function(event, ui) {
    $(this).append($(ui.draggable));

    // count the items in the box and update
    ...
}

從A盒或B盒中取出物品時，減少盒數的正確方法是什么？ 請讓我知道是否沒有任何意義。

謝謝。

Answer 1

在每個放置事件中，計算每個可放置區域中的對象數並更新計數器。

這樣的事情會給你對象的數量：

$(".dropArea").each(function (index, elem) {
    $(item).find(".count").text($(this).find("div").size());
});