使用jquery不改變的顏色

我希望默認的「CSS class」是黑色的，並且使用「selected」的這個選擇功能時會有白色文本。我不知道我要去哪裏錯了使用jquery不改變的顏色

$(function() { 
    $('a.link').click(function() { 
     $('a.link').removeClass('selected'); 
     $(this).addClass('selected'); 
     $(this).css('color', 'white'); 
     $(this).addClass('result-holder'); 
     $(this).css('color', 'black'); 


    }); 
});

形象展示的問題：

enter image description here

http://imgur.com/AquDa

來源

2012-02-12 Matt Cohen

我猜那是因爲你在函數結束時將鏈接變回黑色？ – 2012-02-12 07:28:53

謝謝艾蒂安。但是，當我使用onClick向下移動時，上面的項目是「白色」，因爲沒有黑色。我遇到了問題，我希望默認顏色（除了選定的顏色）爲黑色，並且選中的項目爲白色，因爲它在藍色背景上。我希望我做出某種意義（對此是新的！） – 2012-02-12 07:31:41

您正在使用CSS類的內聯css。不是一個好主意。堅持其中之一。 – gdoron 2012-02-12 07:33:42

這是你現有的與它做什麼點擊與類「鏈接」的任何錨標記任何時間解釋代碼：

$('a.link').removeClass('selected'); // remove 'selected' from all links 
$(this).addClass('selected');   // add 'selected' to clicked link 
$(this).css('color', 'white');   // turn clicked link 'white' 
$(this).addClass('result-holder');  // add 'result-holder' to clicked link 
$(this).css('color', 'black');   // turn clicked link 'black'

您打開點擊鏈接白色，然後把它在同一塊代碼中回到黑色，所以你永遠不會看到它顯示爲白色。

我敢肯定你真正想要做的是如下：

$('a.link').removeClass('selected') // remove 'selected' from all links 
      .css('color', 'black');  // and make them black again 

$(this).addClass('selected')   // add 'selected' to clicked link 
     .css('color', 'white').   // and turn it 'white'

（注意：如果調用一個jQuery對象，你可以在「鏈」起來，像$(this).addClass('selected').css('color','white');)

上的多個功能

我真的不知道你想要做什麼'結果持有人'類，因爲你現在的代碼將它添加到點擊鏈接，但不會從任何東西中刪除它。如果你想將它添加到點擊鏈接像$(this).addClass('result-holder')像你已經這樣做。

請注意，您可以只需添加color:white;到你的「選擇」類的定義，並在您的默認設置color:black;a.link造型簡化這個：

a.link { 
    color : black; 
}  

a.selected { 
    /* your existing style settings here, then: */ 
    color : white; 
}

這裏有一個演示：http://jsfiddle.net/nnnnnn/6qURY/

來源

2012-02-12 07:45:48 nnnnnn

這裏是我對代碼改進的看法：http://jsfiddle.net/Qb3Yr/1/ – 2012-02-12 07:46:27

和類的方法：http://jsfiddle.net/Qb3Yr/2/ – 2012-02-12 07:49:20

我解決了這個問題。 – 2012-02-12 08:02:59

您將其更改爲黑色再次...

$(this).css('color', 'white'); 
    $(this).addClass('result-holder'); 
    $(this).css('color', 'black'); // <====

這等於：

var color = 'white'; 
color = 'black'; 
alert(color); //black...

來源

2012-02-12 07:28:42 gdoron

演示：http://jsfiddle.net/Qb3Yr/1/ – 2012-02-12 07:43:47

@JaredFarrish。感謝演示。但我認爲這很明顯，他的代碼有什麼問題......=） – gdoron 2012-02-12 07:46:05

我不太清楚你的評論是什麼;它的字面意思是在實踐中展示你在答案中展示的內容。如果你不希望它作爲評論，我可以刪除它，但它本身並不適合你。 – 2012-02-12 07:52:05

使用jquery不改變的顏色

回答

相關問題