Question

我有一段文字，每当用户点击按钮时，这些文字就会改变。我需要它的颜色随着每个clic而改变（我有这样的数组中的颜色：var colorArray = [＆＃34; red＆＃34;，＆＃34; blue＆＃34;，＆＃34; red＆＃ 34;，＆＃34;红色＆＃34;＆＃34;绿色＆＃34;＆＃34;蓝色＆＃34;＆＃34;绿色＆＃34;＆＃34;红色＆＃34;]）< / p>

当我从DB读取数组时，数组没有修复。

关于如何通过javascript实现这一点的想法（它适用于手机差距项目）

Answer 1

每次单击按钮，您都可以获取数组的第一个元素并将其放在结尾，这样就是循环。

使用jQuery .css()函数后，您可以将数组的第一种颜色添加到span。

代码应如下所示：

var colorArray = ["red","blue","green"];
$('button').click(function(){
    $('span').css({"color":colorArray[0]});
    colorArray.push(colorArray.shift());
});

<强> See this Fiddle for more details

Answer 2

您可以使用jQuery和css（）函数。请在http://api.jquery.com/css/#css2查看此功能的文档（网站末尾还有一些示例）。最后你会有这样的事情：

$("span#id").css("color", target_color);

您必须使用目标span#id元素的CSS选择器而不是<span>，而target_color必须是数组的颜色，而不是{{1}}。

Answer 3

如果你想要纯粹的js这是js代码：

<script>
  var color = {
    currentColor: 0,
    colorArray: ["red","blue","red","red","green","blue","green","red","orange"],
    changeColor: function(){
      document.getElementById('span1').style.color = color.colorArray[color.currentColor];
      if (color.currentColor < color.colorArray.length-1){
        color.currentColor++;
      }else{
        color.currentColor = 0;
      }
    }
  };
</script>

这是你的HTML：

<input type="button" value="change color" onclick="color.changeColor()">

<span id="span1"></span>

如何为跨区文本添加变量颜色

3 个答案: