如何在使用jQuery切換時更改活動切換的錨點的樣式？

我使用以下切換頁面上的多個鏈接相關數據如何在使用jQuery切換時更改活動切換的錨點的樣式？

<div class="buttons"> 
    <a class="show" target="1">Option 1</a> 
    <a class="show" target="2">Option 2</a> 
    <a class="show" target="3">Option 3</a> 
    <a class="show" target="4">Option 4</a> 
</div> 

<div id="div1" class="targetDiv">Lorum Ipsum 1</div> 
<div id="div2" class="targetDiv">Lorum Ipsum 2</div> 
<div id="div3" class="targetDiv">Lorum Ipsum 3</div> 
<div id="div4" class="targetDiv">Lorum Ipsum 4</div>

JS：

$('.targetDiv').hide(); 
$('.show').click(function() { 
    $('#div' + $(this).attr('target')).toggle('').siblings('.targetDiv').hide(''); 
});

這對於我想要什麼就好了工作，但我想知道是什麼如果可以在每個鏈接處於活動狀態時更改鏈接樣式。所以用戶知道他們正在查看該鏈接的內容。所以如果當前的演出課程是背景：＃000;例如，我可以將其更改爲背景：#fff;不知何故，當該選項DIV正在顯示？然後恢復正常，當它不是？

的jsfiddle當前設置的http://jsfiddle.net/W3HtS/1/

來源

2013-12-19 Simon K

試試這個方法：Working Fiddle

$('.show').not(this).removeClass('active'); 
     if($(this).hasClass('active')){ 
     $(this).removeClass('active'); 
     }else{ 
     $(this).addClass('active'); 
     } 
    });

來源

2013-12-19 06:49:23

感謝這個解決方案，但請參閱對其他解決方案的迴應，這個問題有同樣的小問題。 :) –

現在嘗試我已更新代碼 –

謝謝，似乎無法得到新的代碼工作呢？你能發佈更新的jsfiddle，看看我做錯了什麼嗎？ –

上點擊功能添加活動類名

$('.show').removeClass('active'); 
     $(this).addClass('active');

DEMO

來源

2013-12-19 06:44:31 Sowmya

謝謝，這個作品與一個小問題。如果再次使用相同的按鈕關閉活動按鈕，活動類將保持不變。只有當你打開其中一個時，它纔會消失。有沒有辦法解決這個問題，所以如果你打開/關閉同一個div，它會恢復正常？ –

試試這個

$('.targetDiv').hide(); 

    $('.show').click(function() { 
      $(".show").removeClass("highlight"); 
     $(this).addClass("highlight"); 
     $('#div' + $(this).attr('target')).toggle('').siblings('.targetDiv').hide(''); 
     });

定義樣式使y OU想在亮點類應用

來源

2013-12-19 06:46:58 Dilantha

謝謝，這也適用，但又與其他解決方案有同樣的問題。如果再次使用相同的按鈕關閉活動按鈕，高亮級別仍然存在。只有當你打開其中一個時，它纔會消失。如果在通過相同的按鈕關閉樣式時，我更喜歡它。 –

如何在使用jQuery切換時更改活動切換的錨點的樣式？

回答

相關問題