FAQ dropdown - 點擊時文字顏色發生變化

我爲我的常見問題使用了一個javascript下拉框，我無法弄清楚如何在點擊時讓問題的顏色發生變化，然後再次點擊時變回。FAQ dropdown - 點擊時文字顏色發生變化

這裏的JavaScript：

<script type="text/javascript"> 
function toggle(Info) { 
var CState = document.getElementById(Info); 
CState.style.display = (CState.style.display != 'block') 
        ? 'block' : 'none';} 
</script>

我知道使用：動作將只是工作被點擊的問題時，但是我想樣式它使每個單擊打開的顏色或關閉，因爲這是答案下降的結果，我希望兩者協調一致。

來源

2013-10-29 Joel Grimmond

什麼是HTML doe這是怎麼回事？什麼是'信息'？ –

你如何觸發此切換？你可以創建一個[JSFiddle]（http://jsfiddle.net/）嗎？ – Moob

因此，添加一個類到被點擊的元素。 – epascarello

如果我理解正確，你切換功能顯示/隱藏答案。然後，所有你需要做的是讓問題容器和切換包含的文本顏色

例如CSS類：

document.getElementById(your question).classList.toggle(your-class);

，並在CSS文件

.your-class { 
    color: selected color; 
}

來源

2013-10-29 12:53:29 andrei

請注意'classList'在IE9中無效。使用jQuery或Shim進行全面支持。 – David

我不擅長JQuery ..你能澄清一下我必須添加的東西，以及我如何設置顏色？ –

jquery有一個方法.toggleClass（），它正是這樣做的。你將不得不添加jquery到你的頁面，而不是做document.getElementById，你就不要做$（'＃你的問題'）。toggleClass（'你的類'）。你設置你的CSS類的顏色。。您的課程{color：selected color;} – andrei

<style> 
.classStyle1 {background-color:white} 
.classStyle2 {background-color:green} 
</style> 
<script type="text/javascript"> 
function toggle(Info) { 
var CState = document.getElementById(Info); 

if(CStage.className == "classStyle1"){ 
    CStage.className = classStyle2; 
}else{ 
    CStage.className = classStyle1; 
} 
// or else 
// create style attribute for select element and put style='background-color:white' like this 
if(CStage.style.backgroundColor == "white"){ 
    CStage.style.backgroundColor = 'green'; 
}else{ 
    CStage.style.backgroundColor = 'white'; 
} 
</script>

來源

2013-10-29 13:00:33 ran

如果我理解正確 - 試試這個 CState=document.getElementById("myColor"); CState.onmouseover=function(){this.style.color='red';}; CState.onmouseout=function(){this.style.color='blue';};

來源

2013-10-29 13:02:01 David

FAQ dropdown - 點擊時文字顏色發生變化

回答

相關問題