Question

jQuery toggle（）支持多个状态，并且循环通过尽可能多的状态

如果提供了两个以上的处理程序，.toggle（）将在所有处理程序之间循环他们例如，如果有三个处理程序，那么第一个第一次点击时会调用handler，第四次点击即可第七次点击，依此类推。

以下代码效果很好，在所有三个州中循环。

$('#tag').toggle(function() {
  //set cssClass to 'on'
  //remove all other classes
}, function() {
  //set cssClass to 'off'
  //remove all other classes
}, function() {
  //set cssClass to 'none'
  //remove all other classes
});

我的问题是，在初始页面加载时，后端在#tag上设置了类，但是当单击标签toggle（）时，从第一个切换状态“on”开始循环，而不管初始状态。

我想我正在寻找的是一个智能切换，根据传入当前状态的选项进入下一个状态。

我可能会添加四个状态，所以我不想复杂的if else语句。

n.b课程设置和删除只是一个例子。我正在做其他事情。请不要添加和删除类示例 - 尽管您可以检查类以查找初始状态。

Answer 1

在我看来，你需要对jQuery进行攻击，这肯定不礼貌，但是很有效。

我看了一下jQuery的源代码，这就是它的基本功能：

生成新的唯一ID，并将其存储为第一个函数

guid

存储在jQuery._data(element, 'lastToggle'+guid, index)
使用lastToggle值和您的函数数组

因此，为了更改切换索引，您只需要从第一个函数中读取guid并使用元素上的jQuery._data设置所需的值。

我在这里给你一个简单的例子： http://jsfiddle.net/2gJdG/

这是要点：

var fn1 = function (){
    console.log(1);        
};

$('button').toggle(fn1, function (){
    console.log(2);
}, function(){
    console.log(3);
}, function(){
    console.log(4);
});

jQuery._data($('button').get(0), 'lastToggle' + fn1.guid, 2);

正如您所看到的，通过单击按钮，它将调用第三个功能，依此类推。您需要至少定义变量中的第一个函数，以便稍后访问它的属性。

请记住，这只是一个黑客攻击，有一天可能会因升级你的jQuery而破解。

jquery以初始状态切换3状态

1 个答案: