Javascript 在两个或多个功能之间切换

以下代码似乎不适用于高于1.8的jQuery版本。有人能解释一下，我们如何从更新的版本中获得相同的功能吗？ 另外，我们是否应该有一个类似于元素的结构。单击（function（）{element.toggle（）；}）？为什么toggle（）方法单独在click上工作，而没有在它前面指定.click（）方法

HTML:

试试这个

var计数=0；
函数changeBackground（）{
var color=“”；
开关（计数%3）{
案例0：
color=“蓝色”；
打破
案例1：
color=“红色”；
打破
案例2：
color=“黄色”；
打破
}
$（“内容”）.css（“背景”，颜色）；
计数++；
}

div{
高度：100px；
宽度：100px；
背景：橙色；
}

---

首先，不要试图处理原始CSS属性，这是一种非常不灵活的方法。避免使用

$.fn.css

方法进行样式设置。您应该使用具有必要样式、背景、颜色等的类

现在，我能想到的简单有效的解决方案是使用如下方法：

var classes = ['blue', 'red', 'yellow'];

$("div").toggleClass(function(i, oldClass) {
    var newClass = classes[(classes.indexOf(oldClass) + 1) % classes.length]
    return oldClass + ' ' + newClass;
});

下面是一个简单的演示，它可以在每次单击时切换类

$（'.toggle'）。单击（函数（）{
变量类=[“蓝色”、“红色”、“黄色”]；
$（“div”）.toggleClass（函数（i，oldClass）{
var newClass=classes[（classes.indexOf（oldClass）+1）%classes.length]
返回oldClass+“”+newClass；
});
});
div{padding:20px；border:1px#DDD solid；}
.blue{背景：蓝色；}
.red{背景：red；}
.yellow{背景：黄色；}

切换
谢谢您的回答。切换css样式方法只是为了测试目的。目标本身就是切换不同的函数。你将如何调用这些函数？
$("div").toggle(
  function () {
    $(this).css({"background":"blue"});
  },
  function () {
    $(this).css({"background":"red"});
  },
  function () {
    $(this).css({"background":"yellow"});
  }
);

var classes = ['blue', 'red', 'yellow'];

$("div").toggleClass(function(i, oldClass) {
    var newClass = classes[(classes.indexOf(oldClass) + 1) % classes.length]
    return oldClass + ' ' + newClass;
});