jQuery UI 如何在父级的父级上设置可拖动的包含选项

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8084793/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-27 09:59:16  来源:igfitidea点击:

jQuery UI how to set draggable containment option on parent's parent

jqueryjquery-uijquery-ui-draggable

提问by steampowered

The jQuery UI Draggable interaction has a nice property for setting the containmentas the parent.

jQuery UI Draggable 交互有一个很好的属性,可以将容器设置为父级。

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

I wish to set the containment as the parent's parent. There is no string value to accomplish this, as string the options are

我希望将容器设置为父级的父级。没有字符串值可以完成此操作,因为字符串选项是

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

“父”、“文档”、“窗口”、[x1、y1、x2、y2]

I could calculate x1,y1,x2,y2 of the parent's parent at page load and use those values to set boundaries for a container relative to the document. But the container position can change relative to the parent's parent position if the window is resized after page load. The native 'parent' option keeps the draggable element within the parent element regardless of window resizing.

我可以在页面加载时计算父级的 x1,y1,x2,y2 并使用这些值来设置容器相对于文档的边界。但是如果在页面加载后调整窗口大小,容器位置可以相对于父级的父级位置发生变化。无论窗口大小如何调整,本机 'parent' 选项都会将可拖动元素保留在父元素中。

Is there a way to accomplish this draggable containment using the parent's parent? .

有没有办法使用父级的父级来完成这种可拖动的遏制?.

回答by rossipedia

As per the documentation, the containmentoption can also be a jquery selector or an actual element. So you can do this:

根据文档,该containment选项也可以是 jquery 选择器或实际元素。所以你可以这样做:

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

Or even better yet:

或者甚至更好:

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

回答by wsanville

According to the docs, you do not have topass in a string for the containmentproperty. You can pass in any of:

根据该文档,你不必须在为字符串传递containment特性。您可以传入以下任何一项:

Selector, Element, String, Array

So, just select the parent's parent with jQuery (i.e. $( ".selector" ).parent().parent()), and pass in instead of 'parent'.

因此,只需使用 jQuery(即$( ".selector" ).parent().parent())选择父级的父级,然后传入而不是'parent'.

回答by LABASTIE Fran?ois

This works fine as well:

这也很好用:

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

回答by Druta Ruslan

If i use $(this).parent()my element go over the parent element.

如果我使用$(this).parent()我的元素,请遍历父元素。

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

But with parentit works fine.

parent它工作正常。

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