如何簡化這個jQuery代碼？

我試圖讓每個div比其他人稍微更不透明，一次一個。正如你所看到的，我已經通過變量來簡化其中的一些。如何簡化這個jQuery代碼？

var f1 = $('#f1'); 
var f2 = $('#f2'); 
var f3 = $('#f3'); 
var f4 = $('#f4'); 

if(art==1){ 
f1.css('opacity',1); 
f2.css('opacity',0.9); 
f3.css('opacity',0.9); 
f4.css('opacity',0.9); 
}else if(art==2){ 
f1.css('opacity',0.9); 
f2.css('opacity',1); 
f3.css('opacity',0.9); 
f4.css('opacity',0.9); 
}else if(art==3){ 
f1.css('opacity',0.9); 
f2.css('opacity',0.9); 
f3.css('opacity',1); 
f4.css('opacity',0.9); 
}else if (art==4){ 
f1.css('opacity',0.9); 
f2.css('opacity',0.9); 
f3.css('opacity',0.9); 
f4.css('opacity',1); 
}

來源

2012-02-22 user1189771

你爲什麼要發佈這對你發佈的[此相同類型的問題在這裏]後（http://stackoverflow.com/questions/9387150/simplify-this-jquery-code/9387437#9387437）？從以前的答案中學習並嘗試一下你自己的代碼。如果你試圖自己嘗試一些東西，請問一個更具體的問題。我們不是在這裏爲你重寫你的代碼。投票結果太局部。 – jfriend00 2012-02-22 00:35:08

因爲你不能用for循環做到這一點。我昨天剛開始使用jQuery。 – user1189771 2012-02-22 00:38:24

$("#f1,#f2,#f3,#f4").css("opacity", 0.9); 
$("#f" + art).css("opacity", 1);

或1線你可以這樣做：

$("#f1,#f2,#f3,#f4").css("opacity", 0.9).filter("#f" + art).css("opacity", 1);

我很懷疑你會看到對應＃F +藝術不透明度爲DIV的變化，但如果你確實有一個辦法可以解決這個問題是這樣的：這是一種奇怪的

$("#f1,#f2,#f3,#f4").not("#f" + art).css("opacity", 0.9); 
$("#f" + art).css("opacity", 1);

過濾掉我們規範中的一個值ified已經開始，但我認爲否則你需要使用額外的邏輯去除這個值。

PS。這是一個代碼味道（F +藝術）

來源

2012-02-22 00:35:46

如何

var f1 = $('#f1'); 
var f2 = $('#f2'); 
var f3 = $('#f3'); 
var f4 = $('#f4'); 

var fAll = $([f1, f2, f3, f4]); 

fAll 
    .css('opacity',0.9) 
    .eq(art-1) // -1 because arrays are 0-based 
    .css('opacity',1);

你應該閱讀一些關於jQuery的如何使用結果集（不只是單一的元素），以及如何traverse和manipulate他們

來源

2012-02-22 00:36:43

這不是很簡單，而是一個很好的結構。

var f1 = $("#f1"), 
f2 = $("#f2"), 
f3 = $("#f3"), 
f4 = $("#f4"); 
art == 1 ? (f1.css("opacity", 1), f2.css("opacity", .9), f3.css("opacity", .9), f4.css("opacity", .9)) : art == 2 ? (f1.css("opacity", .9), f2.css("opacity", 1), f3.css("opacity", .9), f4.css("opacity", .9)) : art == 3 ? (f1.css("opacity", .9), f2.css("opacity", .9), f3.css("opacity", 1), f4.css("opacity", .9)) : art == 4 && (f1.css("opacity", .9), f2.css("opacity", .9), f3.css("opacity", .9), f4.css("opacity", 1))

來源

2012-11-09 00:21:25

如何簡化這個jQuery代碼？

回答

相關問題