jQuery多个可拖拽对象创建

这对我来说是一个复杂的问题。这是我想要的：jQuery多个可拖拽对象创建

我设计了一个可拖动的div，并且有一个实例已经在页面上准备拖拽。当用户拖动它时，我想动态地创建它的一个新实例。我也应该能够通过点击一个按钮来移除它们，因此它们都应该是可访问的。

你能指出我做这个的正确途径吗？

这是我到目前为止有：

$(document).ready(function() { 

      $('#dragThis').resizable({ 
       stop: function(event, ui) { 
        var w = $(this).width(); 
        var h = $(this).height(); 
        var tr = $('#contentDiv'); 
        tr.each(function() { 
         //alert(fields[$(this).index()]) 
         $(this).height(h - 45); 
        }); 


        console.log('StopEvent fired') 
        console.log('Width:' + w); 
        console.log('Height:' + h) 
       } 
      }).draggable(
      { 
       containment: $('body'), 
       drag: function() { 
        var offset = $(this).offset(); 
        var offsetImage = $("#<%=dropHere.ClientID %>").offset(); 
        var xPos = offset.left; 
        var yPos = offset.top; 

        $('#posX').text('x: ' + xPos); 
        $('#posY').text('y: ' + yPos); 

       }, 
       stop: function() { 
        var finalOffset = $(this).offset(); 
        var finalxPos = finalOffset.left; 
        var finalyPos = finalOffset.top; 

        $('#finalX').text('Final X: ' + finalxPos); 
        $('#finalY').text('Final X: ' + finalyPos); 
       } 
      });

，这里是我的html：

<div class="dragThis" id="dragThis"> 
        <div class="content" id="contentDiv"> 
         <p> 
          <asp:Label ID="lblContent" Width="2px" runat="server" Text="Label"></asp:Label> 
         </p> 
        </div> 
        <div class="pointer"> 
         <div class="one"> 
         </div> 
         <div class="two"> 
         </div> 
        </div> 
       </div>

我目前能够调整，拖动并获得1个格的位置。我需要让它适用于多个div。

请记住，我需要访问这些div（在他们里面的位置和文本 - 设置和获取）

任何帮助表示赞赏。

谢谢

来源

2011-02-09 Pabuc

有人吗？来吧：/ – Pabuc 2011-02-09 04:26:36

将代码包装成可调用函数。然后，当你创建新的div你应该使用“消灭”的方法来destory的可调整大小+拖动（

$('#dragThis').resizable('destroy').draggable('destroy');

）目前的情况下，然后运行功能重新初始化可调整大小+拖动;

来源

2011-12-13 06:49:21

jQuery多个可拖拽对象创建

回答

相关问题