Alternative to Jquery's .Toggle() Method That Supports Eventdata

Alternative to jQuery's .toggle() method that supports eventData?

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);
});

Best alternative for jQuery toggle() method?

In this case, simply use .toggleClass().

$("a").click(function(){
    $("div").toggleClass("a b");
});

jQuery .toggle event deprecated, What to use?

Add this outside of document.ready

$.fn.clicktoggle = function(a, b) {
    return this.each(function() {
        var clicked = false;
        $(this).click(function() {
            if (clicked) {
                clicked = false;
                return b.apply(this, arguments);
            }
            clicked = true;
            return a.apply(this, arguments);
        });
    });
};

then use the following to replicate the .toggle functionality:

$("#mydiv").clicktoggle(functionA,functionB);

Found on the JQuery Forums

click(function() button - how to toggle styles?

That's the intended result, as .toggle() will show/hide the matched element.

Toggling click handlers in Javascript

Update: Since this form of toggle() was removed in jQuery 1.9, the solution below does not work anymore. See this question for
alternatives.

It looks like toggle() would solve your problem:

$("#mybutton").toggle(myFirstHandlerFunction, mySecondHandlerFunction);

The code above will register myFirstHandlerFunction and mySecondHandlerFunction to be called on alternate clicks.

jquery toggle method taking two functions as parameters

It's a method that binds a handler for the click on the matched elements:

Bind two or more handlers to the matched elements, to be executed on
alternate clicks.

Note: This method signature was deprecated in jQuery 1.8 and removed in jQuery 1.9. jQuery also provides an animation method named .toggle() that toggles the visibility of elements. Whether the animation or the event method is fired depends on the set of arguments passed.

Ref: http://api.jquery.com/toggle-event/

Upgrade guide to 1.9: http://jquery.com/upgrade-guide/1.9/#toggle-function-function-removed

Mimicking jQuery .toggle() with minimum code?

Store your toggle value in the data object of your element.

http://jsfiddle.net/HNxFx/

$(document).on({
    click:function(){
        var toggle = $(this).data("toggler", !$(this).data("toggler")).data("toggler");
        if(toggle){
            console.log('forth');
        } else {
            console.log('back');
        };
    }
});

Issue on Toggling Two Functions in jQuery

Try storing functions in an array , utilizing .click() , Array.prototype.reverse()

function printConsole() {  console.log("This is From Function A");}
function printAlert() {  alert("This is From Function B");}
var fns = [printConsole, printAlert];
$("#toggler").click(function() {  fns[0]();  fns.reverse();})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script><button id="toggler">Toggle Fnctions</button>

---

Related Topics