可调整大小的 Jquery 无法与子类一起正常工作

Question

由于某种原因，无法为孩子调整大小。

<div class="parent"><img class="child"></div>
<div class="parent"><img class="child"></div>
<div class="parent"><img class="child"></div>

当我尝试 $(".parent").resizable( {alsoResize: ".child"});then 调整大小时，它会调整所有图像而不是相应图像的大小。

当我尝试时

$(".parent").resizable({ alsoResize: $(this).closest('.child') });

或

$(".parent").resizable({ alsoResize: $(this).find('.child') });

那么只有 div 正在调整大小，而不是里面的图像。为什么会这样？

另外，当我使用$(".child").resizable(); 时，<div class="ui-wrapper" > 即将到来并变为

<div class="parent"> 
    <div class="ui-wrapper"><img class="child ui-resizable"></div>
</div>

但这里的问题是 img 没有显示，因为 display none 自动出现，ui-wrapper 类的宽度和高度未设置或设置为 0 。请帮忙找出问题。

Answer 1

首先你的选择器不正确；您缺少 . 前缀。其次，this 不是指.parent 元素，它指的是正在创建事件处理程序的范围。要解决此问题，您可以循环遍历.parent 元素并将事件单独附加到它们。试试这个：

$(".parent").each(function() {
    $(this).resizable({ 
        alsoResize: $(this).find('.child')
    });
});