我有一個父 div（如 "#strip17"），其中有幾個子 div。其中許多子 div 包含每一個畫布，用戶應該能夠使用滑鼠在畫布上畫東西。除了最后一個子 div，它應該是用戶能夠抓住父 div 并將其拖動的點。
整個（父）div 需要是可拖動的，就像用戶在 "抓取 "子節點處抓取它并將它放到任何需要的地方。如果你愿意的話，我需要某種 "手柄 "來拖動父 div 的位置。
我的問題在這里。我只能在父級子節點上呼叫 .dragable() ，這意味著用戶無法在任何子節點內的任何畫布元素上繪圖（因為繪圖被解釋為拖動），或者我在拖動子節點 (".camber-move") 上呼叫 .dragable() ，這意味著只有這個節點在移動，而父級節點的其余部分將保持原狀 - 但可繪圖。
我想，這應該可以通過在".camber-move "上呼叫.dragable()并以某種方式說服jQuery-UI不僅移動".camber-move "div，而且還移動其父級 "#strip17"。但是怎么做呢？
// '#<newStripID>' 是父元素的ID。
// '#<newStripID> .camber-move' 是 "抓手 "元素的ID。
$('#' newStripID).draggable（{
"containment": "#content"。
});
html:
<div id=" strip17">
<div class="strip-camber-1"> < canvas></canvas></div>
<div class="strip-camber-1"> <。 canvas></canvas></div>
<div class="strip-camber-1"> <。 canvas></canvas></div>
<div class="strip-camber-1"> <。 canvas></canvas></div>
<div class="camber-move"/span>> </div>
</div>
uj5u.com熱心網友回復：
考慮到以下Demo。https://jqueryui.com/draggable/#handle
你可以將此應用于你的例子：
。$(function() {
$("#strip17"/span>).draggable({
containment: "#content"/span>,
handle: "div.camber-move"。
});
});. strip-camber-1 {
border: 1px solid #CCC;
}
.camber-move {
border: 2px solid #222;
}< link rel="styleheet" href="/code. jquery.com/ui/1.12.1/themes/base/jquery-ui.css">/span>
<script src="https://code. jquery.com/jquery-1.12.4.js"></script>
<script src="https://code. jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div id=" strip17">
<div class="strip-camber-1">/span>< canvas></canvas></div>>
<div class=" strip-camber-1">< canvas></canvas></div>>
<div class="strip-camber-1"> < canvas></canvas></div>>
<div class="strip-camber-1"> < canvas></canvas></div>>
<div class="camber-move"> </div>>
</div>/span>轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/319945.html
標籤：