Question

我想使用setTimeout函数使边框闪烁，只是我找不到完美的时间值，使其在相同的时间间隔内闪烁。我得到一个很长的眨眼，一个很短，又长又短。我怎么能摆脱短暂的？

这是代码：

function border_color(){
     document.getElementById("filedrag").style.borderColor = "white";
     setTimeout(border_color, 1500);
}

function border_color2(){
     document.getElementById("filedrag").style.borderColor = "black";
     setTimeout(border_color2, 1000);
}

border_color();
border_color2();

Alos你可以在这里看到结果：http://jsfiddle.net/GBGu8/

Answer 1

试试这个：

function border_color(){
 document.getElementById("filedrag").style.borderColor = "white";
 setTimeout(border_color2, 1000); 
}

function border_color2(){
 document.getElementById("filedrag").style.borderColor = "black"; 
setTimeout(border_color, 1000); 
}
document.addEventListener("DOMContentLoaded", border_color,false);

Answer 2

相同的间隔，其中一个有一些时间余量

setTimeout(function() {
    setInterval(function() {
        document.getElementById("filedrag").style.borderColor = "white";
    }, 1000);
}, 500);

setInterval(function() {
    document.getElementById("filedrag").style.borderColor = "black";
}, 1000);

http://jsfiddle.net/GBGu8/1/

Answer 3

只需在黑色和白色边框之间切换相同的间隔，不需要两个间隔：

function border_color() {
  var style = document.getElementById("filedrag").style,
      color = style.borderColor;
  style.borderColor = color == 'white' ? 'black' : 'white';
  setTimeout(border_color, 1000);
}
border_color();

使用setTimeout（），JavaScript闪烁边框，时间间隔

3 个答案: