循環遍歷元素並根據鏈接屬性進行更改

試圖弄清楚這一點。我對jQuery並不熟悉，也不瞭解如何遍歷元素並匹配元素。循環遍歷元素並根據鏈接屬性進行更改

我有3個div的：

<div class="first-image"> 
     <img src="images/first.png"> 
    </div> 
    <div class="second-image"> 
     <img src="images/second.png"> 
    </div> 
    <div class="third-image"> 
     <img src="images/third.png"> 
    </div>

而在一旁，在名爲 '複製' 使用rel =第一圖像

<a href="#" onclick="return false" rel="first-image">...</a>

一個div等：鏈接點擊鏈接將使關聯的div中的圖像褪色（使用GSAP TweenMax）以下是我一直在努力做到的功能......但我不完全理解如何遍歷所有「rel」元素，並使與點擊過的人相匹配。

<script> 
//pause slideshow on members to ledger when text is clicked, and show associated image 
$(function() { 
$('.copy').on('click','a',function(e) { 
    e.preventDefault(); 
    var slideName = $(this).attr('rel'); 

    $("rel").each(function(i){ 
    if (this.rel == slideName) { 
     console.log(this); 
    } 
    }); 


    //var change_screens_tween = TweenMax.to('.'+slideName+'', 1, { 
    //autoAlpha:1 
    //}); 
    }); 
    }); 
</script>

我在做什麼錯？我甚至在我的瀏覽器中看不到錯誤。 :-(

多虧了下面的答案，我有更遠。這是我修改後的代碼。

$('[rel]').each(function(k, v){ 
    if (v == slideName) { 
     var change_screens_tween = TweenMax.to('.'+slideName+'', 1, { 
      autoAlpha:1 
     }); 
    } else { 
     var change_screens_tween = TweenMax.to('.'+slideName+'', 1, { 
      autoAlpha:0 
     }); 
    } 
    });  
});

這是開始工作，但使屏幕截圖顯示，然後立即淡出。而且它只能一次有什麼想法

來源

2014-12-19 peridot1986

使用'v'，不'slideName'，當形成類選擇器時。你有三個潛在的價值;其中一個將匹配'slideName'，其中兩個不會。如果不匹配，你想隱藏不匹配的那個（所以'v'），而不是你真正想要顯示的那個（'slideName'）。 –

謝謝！得到它的工作！ – peridot1986

添加括號相對，像這樣：？

$('[rel]').each(function() { 
    if ($(this).attr('rel') == slideName) { 
     console.log(this); 
    } 
});

來源

2014-12-19 21:55:56 ateich

謝謝@ateich！有沒有辦法將所有的「rel」值放入一個數組中，以便在尚未匹配的CSS屬性上設置CSS屬性？我可以找出一個不那麼優雅的解決方案，但你的答案已經幫助。 – peridot1986

我在我的問題中添加了修改的代碼。 – peridot1986

循環遍歷元素並根據鏈接屬性進行更改

回答

相關問題