在沒有點擊或Ctrl的情況下拖動多個DIV點擊

有人可以幫我嗎？我想在同一時間拖動多個項目/ DIV而無需單擊/控制單擊要拖動的項目。這意味着，默認，我想要拖動的項目已經是「選擇」當我的網頁被加載。我想要這樣的this，我在我的本地服務器上嘗試過，但它不適合我。

$(document).ready(function() { 
    var selectedClass = 'ui-state-highlight'; 

    var $draggableElems = $("#draggable div").draggable({ 
     start: function (e, ui) { 
      if (e.target.id == "start") $draggableElems.addClass(selectedClass); 
      else return false; 
     }, 
     stop: function (e, ui) { 
      // reset group positions 
      $('.' + selectedClass).css({ 
       top: 0, 
       left: 0 
      }); 
     }, 
     drag: function (e, ui) { 
      if (e.target.id == "start") { 
       // this works because the position is relative to the starting position 
       $('.' + selectedClass).css({ 
        top: ui.position.top, 
        left: ui.position.left 
       }); 
      } 
     } 
    }); 

    $("#droppable").droppable({ 
     drop: function (e, ui) { 
      var $selectedElems = $('.' + selectedClass).remove().clone(); 
      $selectedElems.appendTo($(this)).add(ui.draggable) // ui.draggable is appended by the script, so add it after 
      .removeClass(selectedClass).css({ 
       top: 0, 
       left: 0 
      }); 
     } 
    }); 
});

我會很感激，如果有人可以幫助我

非常感謝！

來源

2013-06-22 Del

有啥問題的複選框？包含jQuery UI庫之後，jsFiddle示例正常工作。 http://jsfiddle.net/MmWbH/1/ –

tks arie。我是jquery drag的初學者。問題是哪個jquery版本將用於此代碼。我在我的頂級代碼中添加了。但它不起作用 – Del

您還需要在jQuery之後包含jQuery UI庫，您需要使用Draggable＆Droppable插件來啓用拖放操作。檢查官方網站[jQuery UI]（http://jqueryui.com/） –

你忘了jQuery UI庫，上的jsfiddle你只需要檢查，說jQuery UI的1.8.18

<script type="text/javascript" src"js/jquery_ui_1.8.18"></script>

http://jsfiddle.net/MmWbH/2/

來源

2013-06-22 10:42:22 kdureidy

我的意思是，這樣的事情。 http://jsfiddle.net/delfi/eCEU3/1/但問題是當我拖動所有3個框的位置改變。我希望所有的盒子在第一次加載時都會遵循這個位置。 – Del

您的意思是它適用於jsfiddle上的相同代碼，但不適用於您的服務器？您是否在控制檯中看到任何錯誤？ – kdureidy

在沒有點擊或Ctrl的情況下拖動多個DIV點擊

回答

相關問題