jquery - div内のdivをドラッグします

Question

「easyui」jqueryを使用してdivをドラッグしていますが、問題は、親divではなく全身内でdivをドラッグすることです。

コード：

$('#dd2').draggable();
$('#dd3').draggable();
$('#dd4').draggable();

Answer 1

jQuery uiの場合：

$( "#draggable").draggable({ containment: "parent" });

あなたのeasyuiが単にjQueryuiである場合、これはどのように見えるか、あなたは大丈夫です

jQueryUIドキュメント

Answer 2

こんにちは友人私は解決策を得ました、あなたのスクリプトにいくつかのコードを追加してください

  <script>
function constrain(e){
    var d = e.data;
    if (d.left < 0){d.left = 0}
    if (d.top < 0){d.top = 0}
    if (d.left + $(d.target).outerWidth() > $(d.parent).width()){
        d.left = $(d.parent).width() - $(d.target).outerWidth();
    }
    if (d.top + $(d.target).outerHeight() > $(d.parent).height()){
        d.top = $(d.parent).height() - $(d.target).outerHeight();
    }
}
</script>
<div style="position:relative;overflow:hidden;border:1px solid #ccc;width:400px;height:400px">
<div class="easyui-draggable" style="width:100px;height:100px;border:1px solid #ccc" data-options="
            onDrag: function(e){
                constrain(e);
            },
            onStopDrag: function(e){
                constrain(e);
                $(this).css(e.data);
            }
        ">
</div>
</div>

参照：http ：//www.jeasyui.com/forum/index.php？topic = 820.0; prev_next = prev＃new

Answer 3

EasyUIで....

親divをドロップ可能にする必要があります...

このドキュメントをご覧ください... http：//www.jeasyui.com/documentation/index.php#

そしてここにチュートリアルがあります 。http：//www.jeasyui.com/tutorial/dd/dnd2.php

例えば：

$('#yourparentDivsID').droppable({   //used ID in my case... you can use class ... or parent's selector
   onDragEnter:function(e,source){   //do your stuff here
      $(source).draggable('options').cursor='auto';  
   },  
   onDragLeave:function(e,source){  //do your stuff here
      $(source).draggable('options').cursor='not-allowed';  
   }, 
})