2

div を別の Div にドラッグする必要があります。ドラッグ アンド ドロップを行っていますが、私のコードでは Bootstrap JS のスクロールを使用しています。そのため、水平にドラッグすると、スクロールする Div 自体にもドラッグが表示されます。divでドラッグを表示するにはどうすればよいですか?

私のビューコードは以下の通りです。

<fieldset class="span4">
      <legend>Builder</legend>
      <div class="builder scrollspy-example" id="builderBox" data-spy="scroll" style="height: 600px;" data-bind="foreach:items">
             <div class='media draggable alert alert-block fade in' data-bind="attr:{'data-id':ID}">
             <button type='button' class='close' data-dismiss='alert'>×</button>
             <div class='row'>
                  <legend><h4 class='media-heading' data-bind="text:Title" style='margin-left: 30px;'></h4></legend>
             </div>
             <div class="row" style="margin-left: 5px;">
                 <div class='pull-left'>
                      <img class='media-object' data-bind="attr:{src:'http://images.vidzapper.com/'+ImageUrl+'?w=60&h=60'}" style='width: 60px; height: 60px;' />
                 </div>

                </div>
            </div>
        </fieldset>
        <fieldset class="span4">
            <legend>Organizer</legend>
            <div class="Organizer  scrollspy-example" id="drop" data-spy="scroll" style="height: 600px;">
            </div>
        </fieldset>

また、スクリプトでのドラッグ アンド ドロップのコードは次のとおりです。

$("#drop").droppable({
                accept: ".draggable",
                drop: function (event, ui) {
                    console.log("drop");
                    var dropped = ui.draggable;
                    var droppedOn = $(this);
                    $(dropped).detach().css({ top: 0, left: 0 }).appendTo(droppedOn);

                   }
              });
    $("#drop").sortable();

フィールドセットにドラッグを表示するにはどうすればよいですか?

4

1 に答える 1

0

包含プロパティを使用して、ドラッグを指定した要素または領域の境界内に制限します。可能な文字列値: 'parent'、'document'、'window'、[x1, y1, x2, y2]。

$('.draggable').draggable({
    containment:'body'
});

リンク

于 2015-09-04T11:17:19.063 に答える