jQuery UI Draggable и Droppable: вызов функции, когда все перетаскиваемые элементы на странице отброшены

0

У меня возникают проблемы с тем, как вызывать функцию после удаления всех перетаскиваемых элементов. У меня есть две бок о бок столбцы. Список справа содержит 8 элементов, которые отбрасываются в левый столбец, а также 8 элементов (подходящая игра). Я могу вызвать функцию, (предупреждение ("drop")) в коде ниже, когда каждый элемент отбрасывается, но как я могу вызвать функцию после удаления всех элементов на странице? Благодарю!

<script type="text/javascript">
  $(function() {
    $(".draggable").draggable({
    snap: ".snapTarget",
    snapMode: "inner",
    snapTolerance: 15,
    revert: "invalid"
    });

    $(".word1 .wordBg").draggable({
    snapTolerance: 15,
    revert: "invalid"
    });
    $(".word1").droppable({
    accept: ".word1",
    drop: function(){
    alert("drop");
   }
   });
  .... word2 . . .
  .... word8 
  });
  </script>
  • 1
    Вы можете использовать глобальную переменную, чтобы сохранить счет. count++; if(count===8) callMyFunction(); в функции капли.
  • 1
    Нужно видеть HTML, но вы можете при загрузке (страницы) подсчитать, сколько элементов находится в первом столбце, а затем при каждом отбрасывании (во второй, где в данный момент у вас есть предупреждение) подсчитать, сколько элементов во втором, если счетчик второго столбца равен исходному счетчику первого столбца, то все перемещается.

1 ответ

0
Лучший ответ

Благодаря gp и silver в комментариях выше, вот рабочий код:

<script type="text/javascript">
$(".kaminari_match_pagination").hide()
var dropCount = 0;
var wordCount = $('.word').length / 2;

$(function() {
$(".draggable").draggable({
  snap: ".snapTarget",
  snapMode: "inner",
  snapTolerance: 15,
  revert: "invalid"
  });

$(".word1 .wordBg").draggable({
  snapTolerance: 15,
  revert: "invalid"
  });
$(".word1").droppable({
  accept: ".word1",
  drop: function(){
  dropCount++;
    if (dropCount === wordCount) {
      $(".kaminari_match_pagination").show();
 }
 });
 .... word2 . . .
 .... word8 
});
</script>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню