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が存在する場合、どうすればこれを達成できますか?

score 1 · Accepted Answer

jQueryオブジェクトにはメソッドがありません。代わりにメソッドonclickを使用できますon。要素を動的に生成しているため、イベントも委任する必要があります。

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

score 1 · Accepted Answer

.containerクリックされた DOM 要素を基準にして検索する必要があります。

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

2 に答える 2