Question

Is it possible to change the state of a toggle function? Like:

myDiv.toggle … function 1 , function 2

1. I click on the myDiv element, the function 1 executes
2. I click again, function 2
3. I click again, function 1
   BUT
4. Change the state
5. function 1 again
   etc.

But I need to be able to change the state from outside the toggle function.

Answer 1

Here is a javascript object that uses closure to track it’s state and toggle:

    var TOGGLER = function() {
      var _state = true;
      var _msg = "function1";

        var function1 = function() {
            _msg = "function1";
        }

        var function2 = function() {
            _msg = "function2";
        }

      return {
        toggle: (function () {
            _state = !_state;

            if (_state) {
                function1();    
            } else {
                function2();
            } 

            return _msg;
        })
       }
     }();

Here is a jsfiddle that shows how to use it to toggle based with the following jquery: http://jsfiddle.net/yjPKH/5/

  $(document).ready(function() {
     $("#search").click(function() {
         var message = TOGGLER.toggle();
         $("#state").text(message);
     });
 });