我有一个数组:
$years = [1952,1954,1961,1962,1965,1982,1984,1984,1984,1985,1986,1986,1987,1988,1990,1991,1991,1993,1995]
我正在创建一个时间线,我的时间线使用 10 年的范围,所以它看起来像这样:
1950 1960 1970 1980
.........|.........|.........|.........|.........
在 jQuery 的帮助下,我循环遍历这些年的每个函数,并通过创建一个 div 在时间轴上显示它们,并使用左侧的 css 属性(1 年是 22px)定位它们:
$.each(years, function(key, value) {
var event = $('<div>').addClass('event');
var posX = value*21;
event = event.html(value).css('left',posX+'px');
$('#timeline').append(event);
});
到目前为止一切顺利,但我们您可以看到我已经有很多年了,但我无法正确显示它们。
如果在 10 年范围内 有超过 3 个 事件,我想显示一个按钮而不是事件 div,当我点击它时我可以使用弹出窗口以显示其余事件。
我怎样才能做到这一点?
最佳答案
在相关的几十年中处理年份会更容易。我会创建一个 decades
数组并像下面这样填充它:
var $years = [1952,1954,1961,1962,1965,1982,1984,1984,1984,1985,1986,1986,1987,1988,1990,1991,1991,1993,1995];
var decades = [];
for(var i=0; i<$years.length; i++)
{
var year = $years[i];
var decade = (Math.floor(year / 10) * 10);
if(!decades[decade])
decades[decade] = [];
decades[decade].push(year);
}
for(decade in decades){
var years = decades[decade];
// decade will be 1950, 1960, 1980, etc.
// years will be an array of years within that decade
if(years.length > 3) {
// ...
} else {
// ...
}
}
关于javascript - 循环遍历日期数组并使用 javascript/jQuery 标记 10 年范围,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14013067/