在jQuery中调整特定元素调整大小选项Resize

Question

我正在使用jQueryUI可调整大小的小部件，并在页面上有一堆可调整大小的框。当文档加载时，我初始化小部件，如下所示：

$('.ui-draggable').resizable({ 
    minHeight: 10, // 10 is actually the default 
    minWidth: 10, // 10 is actually the default 
    resize: function() { 
     showProperties(this); 
    }, 
}); 

但是，在某些时候，我只希望其中一些元素更改调整大小选项。我正在试图做的是这样的：

if (type == 'sometype') 
{ 
    console.log($('#'+elementID).resizable('option', 'handles')); 
    $('#'+elementID).resizable('option', 'handles', 'e,w'); 
    console.log($('#'+elementID).resizable('option', 'handles')); 
} 

这确实输出：

e,s,se 
e,w 

在控制台

，因此触发事件和选择是正确的，但是代码实际上并不工作：事实上，手柄保持不变，即e，s，se。

这是因为我使用原始init的不同选择器？如果是这样，我怎么才能改变调整大小选项只在原始可调整大小的元素的子集？如果不是，那可能是什么问题？

Answer 1

Handles实际上是将div添加到应用了resizable的元素。看起来，更改选项不会刷新这些句柄。也许有办法将更改应用于特定子集和刷新，但我不知道如何。 但是，一个快速的解决方法是隐藏您不想要的手柄，而不是更改handle选项。您必须将handle选项设置为您需要的所有手柄，然后隐藏那些不需要的手柄。像这样删除se handle例如：

$('#'+elementID).find('.ui-resizable-se').hide();