javascript - 切换多个同名类中 1 个的 css

Question

我已经动态创建了 div ..

<div class="container"></div>

每个 div 中都有一个输入元素。

<div class="container">
   <input type="button" class="container_button" value="toggle" />
</div>

我的目标是仅最小化单击按钮的容器 div ..

$('.container_button').onclick(function() {
   $('.container').css('height','20px');
});

当存在同一类的多个 div 时，如何实现这一点？

Answer 1

你需要找到.container相对于被点击的 DOM 元素。

$('.container_button').click(function () {
   $(this).closest('.container').css('height', '20px');
});

Answer 2

jQuery 对象没有onclick方法，您可以使用on方法来代替，因为您正在动态生成元素，您还应该委托事件。

$(document).on('click', '.container_button', function() {
   $(this).parent('.container').css('height','20px');
   //  ^--- clicked element
});