2010-12-17 18 views
2

我有一個3分div的,jQuery的腳本將被點擊一個div當一個類:復加的jQuery

.red{ background-color: red; } 

我想要做的是修改了jQuery這樣一旦時間。 red類的加入下次就會增加.blue.red.blue等等...

我的腳本ANS可以the in this demo是這樣的:

var $a = $('.box'); 
$a.click(function(){ 

     $(this).addClass('red'); 
}); 

對不起,我不是分享更多,但我可怕的嘗試只會混淆。

我希望我已經說清楚了,如果不是,請提問!

在此先感謝!

UPDATE:

我覺得這個問題還不夠清楚,所以我會嘗試進一步解釋。

什麼需要bascially將三個格,第一次點擊,變成點擊DIV到,第二轉動點擊進入藍色,紅色的等等,他們應該切換(去轉紅色或藍色點擊第一次點擊是唯一的一個計數)

回答

7

編輯:基於下面的評論,它聽起來像你想要顏色替換每個後續項目被點擊,它可以不被尊重。

這應做到:

例子:http://jsfiddle.net/patrick_dw/zUdWq/

$('a').click((function() { 
    var i = 0; 
    var colors = ['blue','red']; 
    return function() { 
     $(this).addClass(colors[i = ++i % 2]).unbind('click'); 
    }; 
})()); 

它使用一個封閉環繞的變量。如果你不需要/不需要,那麼沒有關閉就是一樣的。

例子:http://jsfiddle.net/patrick_dw/zUdWq/1/

var i = 0; 
var colors = ['blue','red']; 

$('a').click(function() { 
    $(this).addClass(colors[i = ++i % 2]).unbind('click'); 
}); 

原來的答覆:

$a.addClass('red').click(function(){ 
    $(this).toggleClass('red blue'); 
}); 

這將通過增加red類開始加載網頁時,則此後將切換red和每個cl上有blue ICK。

如果你想開始沒有對項目的任何類,那麼你可以這樣做:

$a.click(function(){ 
    if(!this.className) { 
     this.className = 'red'; 
    } else { 
     $(this).toggleClass('red blue'); 
    } 
}); 
+0

整潔!我不知道'toggleClass'接受了多個類 – Eric 2010-12-17 21:21:30

+0

這真是太棒了!謝謝!!它不完全是我問(因爲我描述不正確!)我會嘗試修改它,也許以後再問:) – Trufa 2010-12-17 21:22:41

+0

@patrick事情是我不想要轉動切換,我的箴言是,他們應該能夠回到前一個,你選擇的那個(像之前一樣),但現在是紅藍色的紅色藍色。我不知道我是否已經解釋了我自己 – Trufa 2010-12-17 21:25:59