0

这似乎应该非常简单,但我一直在碰壁。

基本上,我在一个数组中有 6 个 DIV 和 6 个数字。(DIV 的数量和数组中的项目数将始终相同。)

数字都是百分比,显示为 0 到 100 之间的数字。我想根据数组中的数字顺序设置每个 DIV 的宽度。

所以,如果我的数组是[50,25,100,75,100,25],那么 DIV 应该是 50% 宽、25% 宽、100% 宽,依此类推。

我认为我的代码在那里 90%,但我显然遗漏了一些东西。用于说明目的的标记只是 6 个空的 DIV。

我的代码是:

var percentages = [50,25,100,75,100,25];

$.each(percentages, function() {
    $('div').width(this + '%');
});

这是我的 JSFiddle:http: //jsfiddle.net/Jkt5w/

4

2 回答 2

1

您当前正在更改每次迭代中所有 div 的宽度。$('div')每次选择每个 div。您可以使用传递给迭代器回调的 index 参数:

$.each(percentages, function(i) {
    $('div').eq(i).width(this + '%');
});

你也可以反过来:访问所有 div 元素,设置它们的宽度并使用.width接受的回调函数为每个元素产生一个宽度:

$('div').width(function(i) { 
    return percentages[i] + '%'; 
});
于 2013-08-13T20:04:58.170 回答
0

刚刚编辑..

获取每个 Div 并设置 Width .. 您的代码为 HTML 中的所有 Div 设置最后一个宽度 % 只需将 Width 赋予单个 Div

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

    var percentages = [50,25,100,75,100,25];

    $.each(percentages, function(i) {
        $('#d' + (i+1)).width(percentages[i] + '%');
    });

});

HTML

<div id='d1'></div>
<div id='d2'></div>
<div id='d3'></div>
<div id='d4'></div>
<div id='d5'></div>
<div id='d6'></div>

在这里提琴

于 2013-08-13T20:08:25.470 回答