Question

我有一个可调整大小的矩形div，带有EST和WEST两侧的自定义手柄，如下所示：

$("div.rect").resizable({

    handles: {

            'e': '#egrip'

            'w': '#wgrip'

        }

    // ....
    // ....
})

我有一个按钮，可以将这些句柄从EST和WEST更改为北和南。

所以当我点击按钮时，'e，w'手柄应该消失，并且应该出现'n，s'处理，并且Div只能从北和南方向调整大小。

我怎么能这样做？

Answer 1

如同评论：

句柄实际上使用DOM更改，这些更改仅在窗口小部件初始化时完成。我不认为它们可以动态更改，您需要调用destroy然后重新创建小部件

所以，你必须有类似的东西：

$("div.rect").resizable({
    handles: {
            'e': '#egrip'
            'w': '#wgrip'
        }
    // ....
    // ....
});

然后，当您想要将可调整大小的句柄从e w更改为n s时：

$("div.rect").resizable("destroy");
$("div.rect").resizable({
    handles: {
            'n': '#ngrip'
            's': '#sgrip'
        }
    // ....
    // ....
});

请记住，destroy调用还会从DOM中删除现有句柄（如果它们具有可调整大小的句柄类，则可能包括#ngrip和#sgrip。如果您想稍后回收它们，可能需要动态保存副本

这是说明这个https://jsfiddle.net/rmzwodj9/

的小提琴

如何使用jquery ui动态更改可调整大小元素的句柄

1 个答案: