0

我有一个 javascript 函数，它使分配的文本在 2 种颜色、灰色和我运行该函数时设置的颜色值之间交替。

这是我使用的代码。功能：

function flashtext(ele,col) {
var tmpColCheck = document.getElementById( ele ).style.color;

  if (tmpColCheck === 'gray') {
    document.getElementById( ele ).style.color = col;
  } else {
    document.getElementById( ele ).style.color = 'gray';
  }
}

然后对于我做的每个独特的闪光（内容是即时生成的）：

     setInterval(function() {
        flashtext('flashingtext1','#ffffff'); 
        }, 500 );

数字flashingtext,flashingtext2每增加一个就递增，并且颜色设置为它将交替使用的颜色，在本例中为白色。

然后

<span id='flashingtext2'>flash me</span>

有什么办法可以修剪整个代码，这样我就不必为每个发生的实例添加新的 javascript。所以我可以把这个功能关闭，然后在 span 标签中定义其余的？就像是

<span id=flashingtext data=#ffffff> flash white </span>

我给的颜色总是在那个和灰色之间交替

基本上，剪掉中间部分。

注意：如果可以提供更简单的方法，也可以使用 jquery。

4

2 回答 2

1

使用 jQuery，您可以在元素上切换类并让每个类设置颜色

setTimeout(function() {
$('#flashText').toggleClass('gray');
}, 500);
于 2012-04-11T22:13:44.450 回答
0

如果您希望将相同的代码应用于所有实例，则为元素提供一个通用类，例如“flashtext”，以便您可以将它们作为一个组进行选择，但使用内联样式设置各个颜色：

<span class='flashingtext' style='color: white'>flash me</span>

然后有一个“灰色”类：

span.gray { color : gray !important;}​

它使用!important它可以覆盖内联样式。

然后您的函数可以选择所有具有该“闪烁文本”类的元素并打开或关闭“灰色”：

setInterval(function() {
   $(".flashingtext").toggleClass("gray");
}, 500);

演示：http: //jsfiddle.net/yenK9/

如果您需要为id跨度分配一个，以便您可以单独选择它们以用于其他目的，那么请继续，但对于这种颜色您不需要。

于 2012-04-11T22:25:19.637 回答