javascript - SetInterval定时改变单元格颜色

标签 javascript html

问题 在下面的代码中,假设我想更改单元格 1 、2 和 4 的颜色,那么它们会以不同的时间间隔更改颜色。 (先说 1 个更改,然后 2 个更改,然后 4 个更改)

我希望它们全部(1,2 和 4)同时改变颜色。 看起来所有(1,2 和 4)都是红色,然后所有 3 又都是蓝色。

这里 temp_array 将包含我必须更改颜色的单元格(假设 temp_array 将有 1,2 和 4。

 function startChangingColor()
       {
            var temp;
            for(var i=0;i<temp_array.length;i++)
            {
                temp = temp_array[i];
                intervalid[i] = setInterval( createCB(temp) ,300);
            }
        }
        function createCB( val )
        {
           return function()
           {
              changeColor( val );
           };
        }

        var flag = true; 
        function changeColor (element)
        {
            if(flag==true)
            {
                 document.getElementById(CELL+element).className='redled';
                 flag=false;
            }
            else if (flag==false)
            {
                 document.getElementById(CELL+element).className='grayled';
                flag = true;
            }
        }

最佳答案

不知道我是否正确阅读此内容,但请尝试以下操作:

var
  cells = document.getElementsByTagName('td'),
  tempArray = [[0, 1, 3], [1, 2, 0]];

var createColorChanger = function (classNames, elements, elementSelection) {
  var currentIndex = 0;

  return function () {
    var className = classNames.shift(), i = 0, lim = elements.length;
    classNames.push(className);

    for (; i < lim; i += 1) {
      elements[i].className = elementSelection[currentIndex].indexOf(i) > -1 ? className : '';
    }

    currentIndex += 1;
    if (currentIndex >= elementSelection.length) {
      currentIndex = 0;
    }
  }
};

setInterval(createColorChanger(['grayled', 'redled'], cells, tempArray), 1000);

演示:http://jsfiddle.net/NZPTE/3/

关于javascript - SetInterval定时改变单元格颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9890241/

相关文章:

javascript - 我用于查找多个空格的正则表达式如何不匹配换行符?

javascript在IE 11中只能以debug模式运行,其他浏览器都可以

javascript - 放入内部时更改可放置图像

javascript - 如何在传单js中获取缩放事件的经纬度

html - 是否可以仅在矩形的一侧绘制三重边框?

javascript - 使用 AJAX、PHP 和 MYSQL 填充依赖下拉列表

javascript - JavaScript 中使用字符串进行类型检测?

javascript - 将对象数组变异为包含具有公共(public)属性的对象的分块数组数组

jquery - 下拉菜单将内容向下移动

PHP 错误 : You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax