요소 클래스가 nav 요소 값과 같으면 요소 숨기기

Question

동적 탐색을 만들려고하는데 탐색 항목을 클릭하면 nav 값과 같은 클래스의 요소가 표시됩니다.

JQuery와 :

$('section nav a').on({ 
     click: function() { 
      var navElement = $(this).val(); 
      if ($('article').attr('class') != navElement) { 
     $(this).hide(); 
      } 
    } 
}); 

HTML :

<section> 
    <div class="inside"> 
     <nav> 
<a href="#" title="typografi&ombrydning">Typografi & Ombrydning</a> 
<a href="#" title="grafiskdesign">Grafisk design</a> 
<a href="#" title="grafik&billeder">Grafik & Billeder</a> 
<a name="Workflow" class="workflow" title="workflow" href="#">Workflow</a> </nav> 
     <article class="typografi&ombrydning workflow"> <img src="images/imgtest.jpg" width="230" height="210"> 
      <h2>Aphyxion</h2> 
      <p class="time">Marts 15, 2012</p> 
      <p>Billeder fra koncerten med aphyxion og molested på elværket i helsingør</p> 
      <a class="read_more" href="#">Læs mere...</a> </article> 
     <article class="grafik&billeder"> <img src="images/imgtest.jpg" width="230" height="210"> 
      <h2>Aphyxion</h2> 
      <p class="time">Marts 15, 2012</p> 
      <p>Billeder fra koncerten med aphyxion og molested på elværket i helsingør</p> 
      <a class="read_more" href="#">Læs mere...</a> </article> 
     <article class="workflow"> <img src="images/imgtest.jpg" width="230" height="210"> 
      <h2>Aphyxion</h2> 
      <p class="time">Marts 15, 2012</p> 
      <p>Billeder fra koncerten med aphyxion og molested på elværket i helsingør</p> 
      <a class="read_more" href="#">Læs mere...</a> </article> 
     <article class="grafiskdesign grafik&billeder"> <img src="images/imgtest.jpg" width="230" height="210"> 
      <h2>Aphyxion</h2> 
      <p class="time">Marts 15, 2012</p> 
      <p>Billeder fra koncerten med aphyxion og molested på elværket i helsingør</p> 
      <a class="read_more" href="#">Læs mere...</a> </article> 
     <article class="workflow"> <img src="images/imgtest.jpg" width="230" height="210"> 
      <h2>Aphyxion</h2> 
      <p class="time">Marts 15, 2012</p> 
      <p>Billeder fra koncerten med aphyxion og molested på elværket i helsingør</p> 
      <a class="read_more" href="#">Læs mere...</a> </article> 
     <div class="clear"></div> 
    </div> 
</section> 

하지만 그것은 너희들이 도와 주실 수 출근하지 못할.

안부

Answer 1

? 클릭 한 탐색 요소를 기반으로 콘텐츠를 표시하려고합니까? 그렇다면 여기를 살펴보십시오. http://jsfiddle.net/cQt5p/. 나는 개인적으로 데이터 속성을 사용하여 클래스를 사용하여 관련 요소를 표시하거나 숨기는 것에 반대합니다.

Answer 2

시도 -이 당신을 위해 무엇을 찾고있는 경우 확실하지 않다

$('section nav a').on({ 
     click: function() { 
      var navElement = $(this).text(); 
      if ($('article').hasClass(navElement)) { 
       $(this).hide(); 
      } 
    } 
});