切换同名多个类中的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

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

$('.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
});