2012-03-26 7 views
1

私は1つのエントリリストを持っています。これらのエントリはアルファベット順に省略されました。今度は、My Entry & Other Entryをボタンをクリックして表示します。jQuery hideレコードタイトルレコードが見つからない場合

このコードでは、class = "item" & class = "title"のMy Entry(class = "class_my"を参照)を表示するボタンをクリックしたとします。私はそのために私は何も(クラス=「項目」&クラス=「タイトル」)

<li id="g" class="item"> 
<a name="g" class="title">G</a> 
    <ul> 
     <li>     
     <a href="?page_id=242&amp;fid=9&amp;entry=due7ya" class="class_other">Grovy Roy</a> 
     <a href="?page_id=242&amp;fid=9&amp;entry=due7ya" class="class_my">Gova Patel</a> 
     </li> 
    </ul> 
</li> 
<li id="h" class="item"> 
    <a name="h" class="title">H</a> 
     <ul> 
      <li>     
      <a href="?page_id=242&amp;fid=9&amp;entry=due7ya" class="class_other">Honey Roy</a> 

      </li> 
     </ul> 
    </li> 
を表示したくない、これを行うが、第2の場合(ID =「H」)に何のクラス=「class_my」を持つことはできません

ありがとうございました!

答えて

2

私が正しく理解していれば、最初はすべての項目が隠されていて、「マイエントリー」をクリックすると、その中に.class_myの項目が1つ表示されます。 "Other Entry"と同じです。あれは正しいですか?

私は親アイテムを見つけるために、closestを使用して、その後、クラスを探してお勧め:

$(".item").hide(); // All them are hidden in the beginning 
$("#my_button").click(function() { 
    $(".class_my").closest(".item").show(); 
}); 

それはあなたが達成しようとしているものではありません場合は、(より多くの情報をあなたの質問を編集して)明確にしてください。あなたがこれまでに試したことも表示して、間違っていることを見つけ出すのを手助けすることができます。

更新:すべての項目が最初に示されている場合、ボタンは、それらのいくつかを隠し、あなたの関数内に「すべてを非表示」に移動します:

$("#my_button").click(function() { 
    $(".item").hide(); // Hide all them, and... 
    $(".class_my").closest(".item").show(); // ...show only the ones you want. 
}); 
+0

あなたがここにpleseは、ヘルプmはhttp://jsfiddle.net/uZAt9/1/私は文書レディ機能でコードを記述してきたし、そのHのタイトル&データ私はそれを行っている –

+0

感謝を隠すことはできませんありがとうたくさんありがとう –

+0

私のコードは、それらを隠すのではなく、それらを表示することです。それらはすべて最初から隠されているか表示されていますか? (あなたのコメントから、答えが "示されているように見えます;私は私の答えを更新します) – mgibsonbr

1

は、このコードを試してみてください。 (btnはあなたのボタンです)。

btn.click(function(){ 
    $('.class_my').closest('.item').show(); 
}); 
1
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>StatockOverflow</title> 
    <script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.1.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('.class_my').hide(); 
      $('.class_my').parent().hide(); 
      $('.class_other').hide(); 
      $('.class_other').parent().hide(); 
     }) 
    function showanchor(obj) { 


     if ($($(obj).parent()).children("ul").children("li").children('a.class_my').length > 0) 
      $($(obj).parent()).children("ul").children("li").show(); 
     $($(obj).parent()).children("ul").children("li").children('a.class_my').show(); 


     } 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
    <ul> 
    <li id="g" class="item"> 
    <a name="g" href="javascript:void(0);" class="title" onclick="showanchor(this);">G</a> 
    <ul> 
     <li>     
     <a href="?page_id=242&amp;fid=9&amp;entry=due7ya" class="class_other">Grovy Roy</a> 
     <a href="?page_id=242&amp;fid=9&amp;entry=due7ya" class="class_my">Gova Patel</a> 
     </li> 
    </ul> 
</li> 
<li id="h" class="item"> 
    <a name="h" href="javascript:void(0);" class="title" onclick="showanchor(this);">H</a> 
     <ul> 
      <li>     
      <a href="?page_id=242&amp;fid=9&amp;entry=due7ya" class="class_other">Honey Roy</a> 
      <a href="?page_id=242&amp;fid=9&amp;entry=due7ya" class="class_my">Gova Patels</a> 

      </li> 
     </ul> 
    </li> 
    </ul> 
    </div> 
    </form> 
</body> 
</html> 
関連する問題