我是否需要使用JQuery删除和替换事件处理程序以交换它们？

Question

1. I want the events click and touchstart to trigger a function.

Of course this is simple with JQuery. $('#id').on('click touchstart', function{...});

2. But then once that event is triggered, I want that same handler to do something else when the events are triggered,

3. and then later, I want to go back to the original handling function.

It seems like there must be a cleaner way to do this than using $('#id').off('click touchstart'); and then re-applying the handler.

How should I be doing this?

Answer 1

The way I would do this is by creating a couple of functions for the handler function to call based on certain flags. Sudo code would be something like this:

function beginning_action() {
...
}

function middle() {
...
}

var beginning_state = true;    

$('#id').on('click touchstart', function{
  if(beginning_state) {
    beginning_action();
  } else {
    middle();
  }
});

Then all you need to do is change the variable beginning_state to change which function is called. Of course you would give them better names that describe what they do and not when they do it.

Additionally, if you want the handler to call more than two functions you can change the beginning_state variable from a boolean to an int and check it's value to determine which function to call.

Good luck!

Answer 2

You can create a counter variable in some construct in your javascript code that allows you to decide how you want to handle your event.

  $(function() { var trackClicks = (function() { var clicks = true; var getClicks = function() { return clicks; }; var eventClick = function() { clicks = !clicks; }; return { getClicks: getClicks, eventClicks: eventClicks } })(); $('#id').on('click touchstart', function { if (trackClicks.getClicks()) { handler1(); } else { handler2(); } trackClicks.eventClick(); }); function handler1() { //firsthandler}; function handler2() { //secondhandler}; }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>