потерянный элемент jquery потерян - PullRequest
Новая
       12

потерянный элемент jquery потерян

0 голосов
/ 31 июля 2009

Может ли кто-нибудь помочь мне, сказав, что в приведенном ниже коде при перетаскивании первого элемента он работает нормально, но при перетаскивании нового элемента свойство draggable ранее созданного элемента теряется. Как я могу сделать перетаскивание, не теряя его? 

 if(tag==normal_tag1.id)
   {            
      normal_tag_d=' <div id="Normal_Tag1_div_dummy'+count1+'" class ="Normal_Tag1_div_dummy" >'+ 'Normal DUMMY</div>';
      document.getElementById('droppable').innerHTML+=normal_tag_d;
      var idx='#Normal_Tag1_div_dummy'+count1;
        $(idx).draggable(
        {
             revert: 'invalid'
        }
        );
        var droppable="#droppable";
        $(droppable).droppable({
            drop: function(ev,ui) {
            alert(ui.draggable);
            }
        });
      count1++;        
   }
else if(tag==normal_tag2.id)
   { 
      normal_tag2_d=' <div  id="Normal_Tag2_div_dummy'+count2+'" class ="Normal_Tag2_div_dummy" >'+
            'Normal DUMMY2</div>';
      var id='#Normal_Tag2_div_dummy'+count2;
      document.getElementById('droppable').innerHTML+=normal_tag2_d;
      $(id).draggable({
          revert: 'invalid'
      });
      $("#droppable").droppable({
        drop: function() {

        }
        });
      count2++;
   }

1 Ответ

0 голосов
/ 31 июля 2009

Если перетаскиваемый объект находится внутри Droppable, вы удаляете его из DOM, когда пишете по внутреннему HTML-адресу Droppable. Вы просто берете существующий контент и добавляете в него еще немного HTML, а затем записываете его обратно в контейнер. Это фактически удаляет элементы DOM внутри контейнера и заменяет их новыми, которые выглядят точно так же, как старые. Любые обработчики старых элементов не применяются повторно. Еще одна вещь, которая меня беспокоит, это то, что ваши переменные не ограничены областью, в которой находится блок, а находятся в глобальном пространстве имен. Конечно, вы включили только фрагмент кода, поэтому я могу неправильно понимать применение кода в обоих случаях.

Кстати, вам лучше (IMO) использовать jquery для добавления элементов вместо простого javascript. 

if (tag==normal_tag1.id)
{            
      $('<div id="Normal_Tag1_div_dummy'+count1+'" class ="Normal_Tag1_div_dummy" >'+ 'Normal DUMMY</div>')
          .appendTo('#droppable' ) // note this doesn't clear #droppable
          .draggable( {
                revert: 'invalid'
           });
      $('#droppable').droppable({
           drop: function(ev,ui) {
                     alert(ui.draggable);
                 }
      });
}
...
...