Alternative To Jquery's .toggle() Method That Supports Eventdata?

The jQuery documentation for the .toggle() method states: The .toggle() method is provided for convenience. It is relatively straightforward to implement the same behavior by hand

Solution 1:

Seems like a reasonable way to do it... I'd just suggest that you make use of jQuery's data storage utilities rather than introducing an extra variable (which could become a headache if you wanted to keep track of a whole bunch of links). So based of your example:

$('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);
});

Solution 2:

Here is a plugin that implements an alternative to .toggle(), especially since it has been removed in jQuery 1.9+.

How to use:

The signature for this method is:

.cycle( functions [, callback][, eventType])

• functions [Array]: An array of functions to cycle between
• callback [Function]: A function that will be executed on completion of each iteration. It will be passed the current iteration and the output of the current function. Can be used to do something with the return value of each function in the functions array.
• eventType [String]: A string specifying the event types to cycle on, eg. "click mouseover"

An example of usage is:

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

I've included a demonstration here.

Plugin code:

(function ($) {
    if (!Array.prototype.reduce) {
        Array.prototype.reduce = functionreduce(accumulator) {
            if (this === null || this === undefined) thrownewTypeError("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."thrownewTypeError("First argument is not callable");

            if (arguments.length < 2) {
                if (l === 0) thrownewTypeError("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 inthis) 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;
            } elseif (typeof c == "function") {
                p.callback = c;
            } elseif (typeof c == "string") {
                p.events = c;
            }
            return p;
        }, {});
        args.events = args.events || "click";
        console.log(args);
        if (args.functions) {
            var currIndex = 0;

            functiontoggler(e) {
                e.preventDefault();
                var evaluation = args.functions[(currIndex++) % args.functions.length].apply(this);
                if (args.callback) {
                    callback(currIndex, evaluation);
                }
                return evaluation;
            }
            returnthis.on(args.events, toggler);
        } else {
            //throw "Improper arguments to method \"alternate\"; no array provided";
        }
    };
})(jQuery);