2011-07-25 9 views
3

は、これは私が持っているものです。.nextを選択します()要素のjQuery

$("#comment").next().attr('shown',0).fadeIn(); 

私はページに隠されている次のコメントを表示しようとしています。しかし、私は一度に2つのコメントを表示しようとしているので、最初のものをクリックすると、次のものが次に表示されます。だから私は属性を示しました。 shown=0NEXTを選択します。上記は機能しません。私はそれがnext(tr[shown=0])であると信じていますが、私は仕事にそれを得ることができません(私は次の行を探してテーブルに)

助けていただきありがとうございます!

+0

大幅に私を助けたとして、これは他の誰かを助け

<div class="blah" data-field="sometext" data-index="1"></div> 

に希望「を返すように」HTMLのデフォルトの属性ではありませんので、それはだろうか?代わりにID、クラス、または名前で試してみてください。 – Warface

答えて

9

nextは、すぐ次の兄弟を返すことができます。

あなたが最初に一致するものを得るために:firstセレクタと、後続のすべての兄弟を返し、nextAllを呼び出すことができます。

$(...).nextAll("tr[shown=0]:first") 
0

SLaksがうまくいく答えが、私のようにあなたのHTMLにカスタム属性を使用していない検討します別の開発者を混乱させる可能性があります。何のカスタムを使用しないだろう。このような何かの属性:

<style> 
.hidden { 
    display:none; 
} 
</style> 

<script> 
$(document).ready(function(){ 
    $('.showmore').click(function(){ 
     $(this).parent().nextAll(':hidden:first').removeClass('hidden'); 
    }) 
}); 
</script> 

<div id="comments"> 
<div class="comment" id="comment1"> 
    Test comment   
    <a href="#" class="showmore">Show More</a> 
</div> 
<div class="comment" id="comment2"> 
    2nd test comment 
    <a href="#" class="showmore">Show More</a> 
</div> 
<div class="comment hidden" id="comment3"> 
    3rd test comment 
</div> 
<div class="comment hidden" id="comment4"> 
    4th test comment 
</div> 
</div> 

Demo

0

私は、これは古い記事ですけど、ちょうど最初の答えは私を投げたタイトルで行きます。しかし、@ SLaksの答えは、私が個人的に探していたものであり、私の問題を修正したものです。

これは実際にはこの記事を見つけている間に、まったく異なる状況で多くのことを助けました。この回答は、彼の回答で言及されているように最高のものです。

私が持っていた問題は、以下のようなものでした。次のものを同様の属性名で取得するには、特定の属性から選択する必要がありましたが、値は異なります。

<div class="blah" data-field="sometext" data-index="0"></div> 
<div class="bar"></div> 
<div class="blah" data-field="sometext" data-index="1"></div> 


$("div[data-field='sometext'][data-index='0']") 
    .nextAll("div[data-field='sometext']:first"); 

以上、それは