這個問題很自我解釋。我可以用「snapMode：'內部'」將它捕捉到div的所有邊，但不僅僅是頂部。任何人都可以想到解決方法嗎？JQuery Draggable：如何使可拖動元素捕捉到div的內部頂部？
$('.draggableThing').draggable({
snap:'.row',
snapMode:'inner',//should say "inner-top" but this is not an available option
snapTolerance:5
});
這是一個黑客位，但如果你只使用你的項目，這部分卡的選項，你可以只註釋掉不需要的功能，在你的jQuery UI的文件。
搜索這些三線在你的jQuery UI的文件：
if(bs) ui.position.top = inst._convertPositionTo("relative", { top: b - inst.helperProportions.height, left: 0 }).top - inst.margins.top;
if(ls) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l }).left - inst.margins.left;
if(rs) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r - inst.helperProportions.width }).left - inst.margins.left;
，並加以註釋，像這樣：
//if(bs) ui.position.top = inst._convertPositionTo("relative", { top: b - inst.helperProportions.height, left: 0 }).top - inst.margins.top;
//if(ls) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l }).left - inst.margins.left;
//if(rs) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r - inst.helperProportions.width }).left - inst.margins.left;
就像我說的有點的黑客，但它的作品。
更新：
我真的不喜歡以前的答案，所以我想通了，如何增加一些SNAPMODE選項jQuery的UI。你仍然需要編輯jQuery-ui文件，但我認爲它可能是值得的。
除了標準的內部，外部和兩者。我添加了以下選項：
方法如下：
搜索：
if(o.snapMode != 'inner') {
var ts = Math.abs(t - y2) <= d;
var bs = Math.abs(b - y1) <= d;
var ls = Math.abs(l - x2) <= d;
var rs = Math.abs(r - x1) <= d;
if(ts) ui.position.top = inst._convertPositionTo("relative", { top: t - inst.helperProportions.height, left: 0 }).top - inst.margins.top;
if(bs) ui.position.top = inst._convertPositionTo("relative", { top: b, left: 0 }).top - inst.margins.top;
if(ls) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l - inst.helperProportions.width }).left - inst.margins.left;
if(rs) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r }).left - inst.margins.left;
}
var first = (ts || bs || ls || rs);
if(o.snapMode != 'outer') {
var ts = Math.abs(t - y1) <= d;
var bs = Math.abs(b - y2) <= d;
var ls = Math.abs(l - x1) <= d;
var rs = Math.abs(r - x2) <= d;
if(ts) ui.position.top = inst._convertPositionTo("relative", { top: t, left: 0 }).top - inst.margins.top;
if(bs) ui.position.top = inst._convertPositionTo("relative", { top: b - inst.helperProportions.height, left: 0 }).top - inst.margins.top;
if(ls) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l }).left - inst.margins.left;
if(rs) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r - inst.helperProportions.width }).left - inst.margins.left;
}
，取而代之的是：
if (o.snapMode != 'inner' && o.snapMode != 'innerTop' && o.snapMode != 'innerBottom' && o.snapMode != 'innerLeft' && o.snapMode != 'innerRight' && o.snapMode != 'outerTop' && o.snapMode != 'outerBottom' && o.snapMode != 'outerLeft' && o.snapMode != 'outerRight') {
var ts = Math.abs(t - y2) <= d;
var bs = Math.abs(b - y1) <= d;
var ls = Math.abs(l - x2) <= d;
var rs = Math.abs(r - x1) <= d;
if (ts) ui.position.top = inst._convertPositionTo("relative", {
top: t - inst.helperProportions.height,
left: 0
}).top - inst.margins.top;
if (bs) ui.position.top = inst._convertPositionTo("relative", {
top: b,
left: 0
}).top - inst.margins.top;
if (ls) ui.position.left = inst._convertPositionTo("relative", {
top: 0,
left: l - inst.helperProportions.width
}).left - inst.margins.left;
if (rs) ui.position.left = inst._convertPositionTo("relative", {
top: 0,
left: r
}).left - inst.margins.left;
}
var first = (ts || bs || ls || rs);
if (o.snapMode != 'outer' && o.snapMode != 'innerTop' && o.snapMode != 'innerBottom' && o.snapMode != 'innerLeft' && o.snapMode != 'innerRight' && o.snapMode != 'outerTop' && o.snapMode != 'outerBottom' && o.snapMode != 'outerLeft' && o.snapMode != 'outerRight') {
var ts = Math.abs(t - y1) <= d;
var bs = Math.abs(b - y2) <= d;
var ls = Math.abs(l - x1) <= d;
var rs = Math.abs(r - x2) <= d;
if (ts) ui.position.top = inst._convertPositionTo("relative", {
top: t,
left: 0
}).top - inst.margins.top;
if (bs) ui.position.top = inst._convertPositionTo("relative", {
top: b - inst.helperProportions.height,
left: 0
}).top - inst.margins.top;
if (ls) ui.position.left = inst._convertPositionTo("relative", {
top: 0,
left: l
}).left - inst.margins.left;
if (rs) ui.position.left = inst._convertPositionTo("relative", {
top: 0,
left: r - inst.helperProportions.width
}).left - inst.margins.left;
}
if (o.snapMode == 'innerTop') {
var ts = Math.abs(t - y1) <= d;
if (ts) ui.position.top = inst._convertPositionTo("relative", {
top: t,
left: 0
}).top - inst.margins.top;
}
if (o.snapMode == 'innerBottom') {
var bs = Math.abs(b - y2) <= d;
if (bs) ui.position.top = inst._convertPositionTo("relative", {
top: b - inst.helperProportions.height,
left: 0
}).top - inst.margins.top;
}
if (o.snapMode == 'innerLeft') {
var ls = Math.abs(l - x1) <= d;
if (ls) ui.position.left = inst._convertPositionTo("relative", {
top: 0,
left: l
}).left - inst.margins.left;
}
if (o.snapMode == 'innerRight') {
var rs = Math.abs(r - x2) <= d;
if (rs) ui.position.left = inst._convertPositionTo("relative", {
top: 0,
left: r - inst.helperProportions.width
}).left - inst.margins.left;
}
if (o.snapMode == 'outerTop') {
var ts = Math.abs(t - y2) <= d;
if (ts) ui.position.top = inst._convertPositionTo("relative", {
top: t - inst.helperProportions.height,
left: 0
}).top - inst.margins.top;
}
if (o.snapMode == 'outerBottom') {
var bs = Math.abs(b - y1) <= d;
if (bs) ui.position.top = inst._convertPositionTo("relative", {
top: b,
left: 0
}).top - inst.margins.top;
}
if (o.snapMode == 'outerLeft') {
var ls = Math.abs(l - x2) <= d;
if (ls) ui.position.left = inst._convertPositionTo("relative", {
top: 0,
left: l - inst.helperProportions.width
}).left - inst.margins.left;
}
if (o.snapMode == 'outerRight') {
var rs = Math.abs(r - x1) <= d;
if (rs) ui.position.left = inst._convertPositionTo("relative", {
top: 0,
left: r
}).left - inst.margins.left;
}
我不知道，但好像jQueryUI的不支持類似的東西。您可以使用此解決方法來獲取所需的行爲。只需在您的div中添加另一個div用於捕捉。
<div class='row'>
<div class='innerHack'></div>
</div>
哇，這太酷了！我會這樣做，但我真的不知道如何閱讀JQuery文件。非常感謝！ –