0

次のコードのように、レイアウトを使用して 5 つの div を作成しました。

//Div one
<div class="container">
<div class="hide">
    <button class="hide" value="hide" />
</div>
</div>

//Div Two
<div class="container">
<div class="hide">
    <button class="hide" value="hide" />
</div>
</div>

//Div Three
< div class="container">
<div class="hide">
    <button class="hide" value="hide" />
</div>
</div>

2番目のdivの非表示ボタンをクリックすると、2番目のdivを非表示にしたい..つまり、ボタンのクリックに対応するdivを非表示にしたい.. jqueryのみでそれを行う方法???

jquery で「this」キーワードを使用してみましたが、1 つだけでなくすべてのコンテナーが非表示になります。私を助けてください

4

2 に答える 2

2
$('button.hide').on('click', function() {
   $(this).closest('.container').hide()
});

そのクラス名にはさらに異なる要素があるため、セレクターbutton.hideの代わりに指定しました.hide

jQueryドキュメントclosest()で使用法を参照してください

現在の要素から始まり、DOM ツリーを上に向かって、セレクターに一致する最初の要素を取得します。

于 2012-08-31T07:57:43.940 に答える
0

jQuery.closest()メソッドを使用して DOM ツリーを上に移動し、<div>. 次に、div で非表示をトリガーできます。

$('button.hide').click(function() {
    $(this).closest('.container').hide();
});

もちろん、これは DOM 対応で行われます。$(document).ready(function() { /*...*/ });

于 2012-08-31T07:58:33.870 に答える