droppable元素在删除的页面中拖动

时间:2012-01-09 05:26:29

标签: jquery html

我使用了jquery布局,在那个布局中我使用了拖放。但我不知道为什么droppable元素没有拖拽下降区域。我用它来拖累但是不能取得成功

jQuery(function() {
  jQuery(".component").draggable({
      //use a helper-clone that is append to 'body' so is not 'contained' 
      //by a pane
    helper:  function () { 
                            return jQuery(this).clone().appendTo('body')
                               .css({'zIndex':5,}).show(); 
    },
    cursor: 'move'
  });

  jQuery('.ui-layout-center').droppable({ 
     accept:  '.component',
     drop:  function (event, ui) {
                      jQuery(this).append(jQuery(ui.draggable).clone()); 
     }
  }); 
});

我的html页面就是这样..

<div class="ui-layout-south">
  <button onclick="myLayout.toggle('north')">Toggle North Pane</button>
</div>

<div class="ui-layout-east"><span>Components</span>
  <div class="component" style="width: 30px; border: 2px solid #CCC; 
                   background: #009; padding: 10px;"></div>
  <p><button onclick="myLayout.close('east')">Close Me</button></p>
</div>

<div class="ui-layout-center">
</div>

1 个答案:

答案 0 :(得分:0)

这是你在找什么?

http://jsfiddle.net/WpRTc/2/

我不确定您使用的是哪个jquery版本。所以我在这里使用了live方法。如果您使用的是最新版本的jquery,请尝试“on”而不是live。