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

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();

您可以在这里查看结果： 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();