javascript - 闪烁边框，时间间隔，使用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();