1

クラス「赤」をクリックすると、このdiv全体が削除されます。私のJSは

$('document').ready(function(){
    $('.buttons .red').click(function(){
        $(this).parent('div').parent('div').remove();
        $(this).parent('div').remove();
    });
});

これが私のHTMLです

<div data-role="collapsible" data-collapsed="false">
    <h3> Keep</h3>
    <div id= "container">
        <a href="categories.html" class="green" data-transition="slide"  data-type="horizontal" data-role="button">Tax Deductible</a>
        <a href="#" class="red" data-transition="slide"  data-type="horizontal" data-role="button">Tax Deductible</a>
        <a href="categories.html" class="blue" data-transition="slide"  data-type="horizontal" data-role="button">Tax Deductible</a>
    </div>
</div>
4

4 に答える 4

1 
$('document').ready(function(){
$('.red').click(function(){


     $(this).parent().parent().remove();

});
});

動作します。祖父母を削除するだけで済みます。「親」は祖父母の中にいるからです。

于 2012-10-11T11:57:41.877 に答える
0

クラスボタンを終了しません。

$('.red').click(function(){


console.log($(this).parent('div').parent('div'));


});

作品

于 2012-10-11T12:00:35.610 に答える
0

私は提案します：

$('a[data-role="button"].red').click(
    function(e){
        e.preventDefault();
        $(this).closest('div[data-role]').remove();
    });

JSフィドルデモ。

これにより、値が。で、クラスが。の属性をa持つ要素にクリックイベントがアタッチされます。data-rolebuttonred

イベントのデフォルトの動作clickは防止され（hashChangeまたはページジャンプ/ロードを防止するため）、セレクターはDOMをa要素から、属性が設定された最初の祖先要素に移動し、data-roleその要素を削除します。

の使用は、要素を他の要素の内部（同じ祖先内）にclosest()ネストでき、関数は引き続き機能することを意味します（一方、祖先が挿入/削除されるたびにjQueryセレクターを書き直す必要があります。aparent().parent()...

参照：

于 2012-10-11T12:02:14.340 に答える
0

ページにボタンクラスがないため、コードはおそらく機能しません。また、最初の子育てDIVは折りたたみ可能なDIVとともに削除されるため、2番目のremoveを呼び出す必要はありません。

:eq()もう1つは、祖父母を選択する必要がある場合にセレクターを使用できることです。

作業コード（コンテナdivにクラスボタンのみを追加しました）：

$('document').ready(function(){
    $('.buttons .red').click(function(){
        $(this).parents('div:eq(1)').remove();
        return false;
    });
});​

jfFiddle： http: //jsfiddle.net/RxyPk/

于 2012-10-11T11:59:40.417 に答える