如何简化这个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代码？

回答

相关问题