Jquery dropppable, добавленный через событие mouseover, не видит событие OVER - PullRequest
Новая
       3

Jquery dropppable, добавленный через событие mouseover, не видит событие OVER

1 голос
/ 26 ноября 2011

Поскольку у меня может быть 1000 (или более) DIVS, которые можно перетаскивать друг на друга, я обнаружил, что установка jquery .droppable на все DIV, когда загрузка страницы заканчивается, занимает слишком много времени.Итак, я попытался использовать функцию наведения мыши, чтобы добавить отбрасываемый объект только к тем DIV, на которые пользователь фактически пытается что-то добавить.

Это прекрасно работает для отбрасывания: но не действует должным образом для пере:

Вот фрагмент кода 

$('.nc').mouseover(function() { 
   $(this).droppable({
      tolerance: 'touch',

      over: function( event, ui ) { // do this .. highlight the div being dropped on // },

      out: function(event, ui) { // do this .. unhighlight the div being dropped on // },

      drop: function( event, ui ) { // do this .. handle the drop even  // }

   });
});

Когда я перетаскиваю на любойDIV с классом .nc, падение действительно работает нормально.Тем не менее, «над» не работает, когда я перетаскиваю элемент в DIV, если моя мышь не переместилась через DIV, прежде чем пытаться что-то перетащить на него.

Обратите внимание, я знаю, что мог бы использовать hoverClass для выделения, но мне нужно предоставить некоторую логику в событии over, чтобы он выделялся только при определенных условиях.

Я сражалсяэто надолго, так что надеюсь, кто-то может помочь.Спасибо.

1 Ответ

0 голосов
/ 26 ноября 2011

Для каждой из строк 

  over: function( event, ui ) { // do this .. highlight the div being dropped on // },

  out: function(event, ui) { // do this .. unhighlight the div being dropped on // },

  drop: function( event, ui ) { // do this .. handle the drop even  // }

конец "}" закомментирован, поэтому он нарушает функцию 

$('.nc').mouseover(function() {
   $(this).droppable({
      tolerance: 'touch',

      over: function( event, ui ) {  },

      out: function(event, ui) {  },

      drop: function( event, ui ) { }

   });
});
...