0

任何人都可以告诉我，在下面的给定代码中，当第一次拖动元素时它可以正常工作，但是当拖动新元素时，之前创建的元素的可拖动属性会丢失。我怎样才能在不丢失的情况下进行拖动？

 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++;
   }
4

1 回答 1

0

如果可拖动对象位于可放置对象内部，则当您覆盖可放置对象的 innerHTML 时，会将其从 DOM 中移除。您只需获取现有内容并向其中添加更多 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);
                 }
      });
}
...
于 2009-07-31T11:04:48.533 回答