1

是否可以在 .each() 函数中为每个结果编写单独的代码?

我想在示例中做的是让每个订单项具有唯一的颜色。这可以在 .each() 中完成吗?

$(document).ready(function() {    
    $('li').each(function() {
        $(this).css('color', 'purple');
    }); 
// End it all    
});​

http://jsfiddle.net/rJGYL/

编辑:为了更简洁,是否可以为每个项目添加唯一的 css?例如,不仅仅是一种颜色,而是说我想让第一个项目的字体粗体为粗体,下一个项目为斜体......

4

4 回答 4

5
$(document).ready(function() {

var colors = ['red','green', 'blue', 'pink']

    $('li').each(function(i) {
        $(this).css('color', colors[i]);
    });


// End it all    
});​

JSFiddle:http: //jsfiddle.net/lucuma/aU4kr/

您可以使用每个函数中的索引来引用数组。如果您想了解更多详细信息,可以在这里找到:http: //api.jquery.com/each/

于 2012-05-30T14:01:45.047 回答
0

是的,您可以使用以下代码执行此操作

$(document).ready(function() {
  var colors = ['black','red','purple','yellow']
    $('li').each(function(i) {
        $(this).css('color', colors[i]);
    });


// End it all    
});​

工作小提琴

把你的颜色放在colors数组中。

更新

您可以像这样为数组中的每个 li 定义不同的 css

$(document).ready(function() {
    var css = [{'font-weight':'bold','font-size':'25px','color':'red'}
               ,{'color':'purple'},{'color':'black'},{'color':'yellow'}]
    $('li').each(function(i) {
        $(this).css(css[i]);

    });


// End it all    
});​

工作小提琴

您已将css属性定义为对象数组中的对'key':'value'css

于 2012-05-30T14:02:43.987 回答
0

您可以指定一个可用颜色的数组,然后使用每个项目的索引从该数组中选择:

http://jsfiddle.net/rJGYL/2/

$(document).ready(function() {
    var colors = ["purple", "red", "blue", "yellow"];

    $('li').each(function(index) {
        $(this).css('color', colors[index]);
    });


    // End it all    
});​
于 2012-05-30T14:02:51.453 回答
0
var colors= ['red','green', 'blue'];

$('li').css('color', function() {
    return colors[i];
});
于 2012-05-30T14:14:09.620 回答