減少中繼器上圖像的不透明度

Question

我有一箇中繼器控件，每個項目模板都有一個圖像和鏈接按鈕。

我想要做的是當點擊鏈接按鈕時，除與點擊相關的圖像之外的每個圖像都會達到50％的不透明度。

<asp:Repeater ID="Categories" runat="server" OnItemCommand="showSubCat_itemCommand"> 
    <HeaderTemplate></HeaderTemplate> 
    <ItemTemplate> 
     <div class="catListing"> 
     <img class="RepeaterImage" src="/images/<%#Eval("imageUrl").ToString() ?? "" %>"/> 
     <asp:LinkButton ID="showSubCats" runat="server" text='<%# Eval("Name") %>' CommandArgument='<%# Eval("id") %>'/> 
     </div> 
    </ItemTemplate> 
    <FooterTemplate></FooterTemplate> 
</asp:Repeater> 

這是我轉發，我希望這樣的事情會的工作：

<script type="text/javascript"> 

$('[ID*="showSubCats"]').click(function() { 
    debugger; 
     $(".RepeaterImage").not(this).stop().animate({ opacity: 0.4 }, 300); 
     $(this).stop().animate({ opacity: 1.0 }, 300); 

    }); 
</script> 

什麼也沒有發生當任何showsubcats的鏈接被點擊的按鈕。我猜我可能會走錯路！

任何協助將是偉大的。

Answer 1

此asp:LinkButton的html標記中的id屬性不會是showSubCats。 我建議你在asp:LinkButton設置CssClass="showSubCats"，然後用這個javscript：

<script type="text/javascript"> 

    $('.showSubCats').click(function() { 

     $(".RepeaterImage").not(this).stop().animate({ opacity: 0.4 }, 300); 
     $(this).stop().animate({ opacity: 1.0 }, 300); 

    }); 
</script>