开始时 JQuery UI 可拖动包含

Question

我有一个可拖动对象，它需要在启动时而不是在初始化时设置它的包含。

编辑 原因是可拖动对象是组件的一部分，并且该组件可以存在于多个位置，因此我需要检查（在开始时）它在 DOM 中的位置，并根据它的位置设置适当的容器。

例如，如果元素A中存在draggable，则为元素A设置包含。如果元素B中存在实例，则将其设置为元素B。

为了进一步澄清，我不是在寻找直接父级作为容器（因为我相信这可以通过将“父级”传递给控件来处理），而是一个任意父级，因此我需要这样做开始拖动的逻辑。

I've tried the obvious (jsfiddle)

$('#dragMe').draggable({
    start: function (event, ui) {
        $(this).draggable('option', "containment", '#container');
    },
});

这有效，但只有在您拖动元素两次之后。因此，例如，如果您拿起红色盒子并将其拖到安全壳外，它会让您。但是，如果您将其放入容器中，然后再次拖动它，它将被正确包含。 （注意，我使用的是 Chrome）

这让我相信在调用 start 函数之前检查了包含。

有什么方法可以让 JQuery UI 识别更改的选项，还是需要手动将可拖动对象限制在边界内？

Answer 1

我决定跟进我的怀疑，即在调用开始事件之前设置了收容措施。

我在 JQuery UI 源代码中找到了这段代码：

//Set a containment if given in the options
this._setContainment();

//Trigger event + callbacks
if(this._trigger("start", event) === false) {
    this._clear();
    return false;
}

我只是简单地切换了顺序，以便在事件之后调用_setContainment() 函数。这解决了我的问题，但我有点担心这可能产生的影响（包括错误/可维护性）。

因此，如果有人有更好的想法，我将不胜感激。