JQuery UI, как установить параметр перетаскиваемого сдерживания на родительский родительский элемент

Взаимодействие jQuery UI Draggable имеет приятное свойство для установки оболочки в качестве родителя.

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

Я хочу установить оболочку в качестве родительского родителя. Для этого нет строкового значения, так как строка содержит

'parent', 'document', 'window', [x1, y1, x2, y2]

Я мог бы рассчитать x1, y1, x2, y2 родительского родителя при загрузке страницы и использовать эти значения для установки границ контейнера относительно документа. Но позиция контейнера может измениться относительно родительской позиции родителя, если окно будет изменено после загрузки страницы. Исходный "родительский" вариант сохраняет элемент перетаскивания в родительском элементе независимо от изменения размера окна.

Есть ли способ выполнить эту перетаскиваемую оболочку с помощью родительского родителя? .

Ответ 1

В соответствии с документацией параметр containment также может быть селектором jquery или фактическим элементом. Итак, вы можете сделать это:

$('.selector').draggable({
    containment: $('.selector').parent().parent()
});

Или еще лучше:

$('.selector').each(function(){
    $(this).draggable({
        containment: $(this).parent().parent()
    });
});

Ответ 2

В соответствии с документами вам не нужно передавать строку для свойства containment. Вы можете передать любой из:

Selector, Element, String, Array

Итак, просто выберите родительский родительский элемент с jQuery (т.е. $( ".selector" ).parent().parent()) и перейдите вместо 'parent'.

Ответ 3

Это прекрасно работает:

$('.selector').draggable({
    containment: "#parent",
    scroll: false
});