替代jQuery的支持eventData的.toggle()方法?

.toggle()方法的jQuery文档指出:

提供.toggle()方法是为了方便起见。 手动实现相同的行为相对简单,如果.toggle()中内置的假设certificate是有限的,这可能是必要的。

内置到.toggle的假设已certificate限制了我当前的任务,但文档没有详细说明如何实现相同的行为。 我需要将eventData传递给提供给toggle()的处理程序函数,但似乎只有.bind()才支持这个,而不是.toggle()

我的第一个倾向是使用一个全局的标志来处理单个处理函数来存储点击状态。 换句话说,而不是:

 $('a').toggle(function() { alert('odd number of clicks'); }, function() { alert('even number of clicks'); }); 

做这个:

 var clicks = true; $('a').click(function() { if (clicks) { alert('odd number of clicks'); clicks = false; } else { alert('even number of clicks'); clicks = true; } }); 

我没有测试后者,但我怀疑它会起作用。 这是做这样的事情的最佳方式,还是有更好的方式让我失踪?

谢谢!

看起来像是一种合理的方式…我只是建议您使用jQuery的数据存储实用程序而不是引入额外的变量(如果您想跟踪一大堆链接,这可能会变得很头疼) 。 所以基于你的例子:

 $('a').click(function() { var clicks = $(this).data('clicks'); if (clicks) { alert('odd number of clicks'); } else { alert('even number of clicks'); } $(this).data("clicks", !clicks); }); 

这是一个实现.toggle()替代的插件,特别是因为它已经在jQuery 1.9+中删除了。

如何使用:

此方法的签名是:

 .cycle( functions [, callback] [, eventType]) 
  • functions [Array]:一组循环的函数
  • callback [Function]:将在每次迭代完成时执行的函数。 它将通过当前迭代和当前函数的输出。 可以用来处理functions数组中每个函数的返回值。
  • eventType [String]:一个字符串,指定要循环的事件类型,例如。 "click mouseover"

使用的一个例子是:

 $('a').cycle([ function() { alert('odd number of clicks'); }, function() { alert('even number of clicks'); } ]); 

我在这里加入了一个演示。

插件代码:

 (function ($) { if (!Array.prototype.reduce) { Array.prototype.reduce = function reduce(accumulator) { if (this === null || this === undefined) throw new TypeError("Object is null or undefined"); var i = 0, l = this.length >> 0, curr; if (typeof accumulator !== "function") // ES5 : "If IsCallable(callbackfn) is false, throw a TypeError exception." throw new TypeError("First argument is not callable"); if (arguments.length < 2) { if (l === 0) throw new TypeError("Array length is 0 and no second argument"); curr = this[0]; i = 1; // start accumulating at the second element } else curr = arguments[1]; while (i < l) { if (i in this) curr = accumulator.call(undefined, curr, this[i], i, this); ++i; } return curr; }; } $.fn.cycle = function () { var args = Array.prototype.slice.call(arguments).reduce(function (p, c, i, a) { if (i == 0) { p.functions = c; } else if (typeof c == "function") { p.callback = c; } else if (typeof c == "string") { p.events = c; } return p; }, {}); args.events = args.events || "click"; console.log(args); if (args.functions) { var currIndex = 0; function toggler(e) { e.preventDefault(); var evaluation = args.functions[(currIndex++) % args.functions.length].apply(this); if (args.callback) { callback(currIndex, evaluation); } return evaluation; } return this.on(args.events, toggler); } else { //throw "Improper arguments to method \"alternate\"; no array provided"; } }; })(jQuery);