javascript - 如何在可调整大小中添加特定的 maxWidth 选项值？

Question

http://jsfiddle.net/ndpnU/2/

我想设置 maxWidth，但找不到任何解决方案，您可以帮助我吗？

我用这个:

$("#one").resizable({
    minWidth: 200,
    handles: 'e',
    maxWidth: $(this).next().width() - 200 + $(this).width(),
    alsoResizeReverse: "#two",

});

Answer 1

可调整大小的 maxWidth 属性确实已设置，只是没有设置为您期望的值。当我在浏览器中加载页面时，maxWidth 设置为大约 1200。这是因为 $(this).next().width() 返回 null 和 $(this).width() 可能不会返回您期望的值。

您似乎假设 this 引用 #one 元素。但是，在您的代码中，this 实际上指的是 #document 元素。因此 $(this).next() 返回 null，因为 #document 没有同级元素。您可以使用浏览器中的 JS 调试/开发工具来验证这一点。

也许您确实想要使用 #one 元素，而不是 #document。在这种情况下，您可以按如下方式修复代码:

var $oneEl = $("#one");
$oneEl.resizable({
    minWidth: 200,
    handles: 'e',
    maxWidth: $oneEl.next().width() - 200 + $oneEl.width(),
    alsoResizeReverse: "#two",
});