2013-09-05 22 views
1

請考慮下面的HTML:jQuery的循環匹配類懸停的錨和應用CSS

<div class="week start-available start-mid end-available end-mid overlap-False"> 


       <a href="http://alink.com" class="20130906-20130912"> 
        <span class="wk-start" style="">  

          <span class="day overlap-False">9 </span> 


          <span class="day overlap-False">10 </span> 


          <span class="day overlap-False">11 </span> 


          <span class="day overlap-False">12 </span> 

        </span> 
       </a> 



       <a href="http://alink.com" class="20130913-20130919"> 
        <span class="wk-end"> 

          <span class="day overlap-False">13 </span> 


          <span class="day overlap-False">14 </span> 


          <span class="day overlap-False">15 </span> 

        </span> 
       </a> 


      </div> 
<div class="week start-available start-mid end-available end-mid overlap-False"> 


       <a href="http://alink.com" class="20130913-20130919"> 
        <span class="wk-start" style="">  

          <span class="day overlap-False">16 </span> 


          <span class="day overlap-False">17 </span> 


          <span class="day overlap-False">18 </span> 


          <span class="day overlap-False">19 </span> 

        </span> 
       </a> 



       <a href="http://alink.com" class="20130920-20130926"> 
        <span class="wk-end"> 

          <span class="day overlap-False">20 </span> 


          <span class="day overlap-False">21 </span> 


          <span class="day overlap-False">22 </span> 

        </span> 
       </a> 


      </div> 

我想使用jQuery CSS應用到定位與同一類錨目前徘徊。每個錨點都有另一個具有相同類別但屬於不同父級的錨點。

我假設我需要循環所有的元素來匹配這個人的類,但必須承認我有點迷路。任何幫助將不勝感激。

+0

刷新問題短標記實際上你需要什麼。 –

+0

有點困惑......當你懸停在錨點上時,你是否想要突出顯示其他錨點以及所有類別相同的類別或任何類別的錨點? – gvee

回答

3

嘗試

var $as = $('.week > a').hover(function(){ 
    $as.not(this).filter('.' + this.className).addClass('test') 
}, function(){ 
    $as.not(this).filter('.' + this.className).removeClass('test') 
}) 

演示:Fiddle

+0

兩者都是完美的解決方案,謝謝你的幫助。 – ecolema