Enable and disable function in jquery

Asked

Viewed 1,914 times

1

I need to disable a function in jquery, for example, when I click on a div, a function that I set will no longer run, just when I click on another div it will work again. The function is loaded when the site is loaded.
I need when I click on a div this function no longer works, just when I click on another div it comes back.

function executar_whell() {
    function debounce(fn, delay) {
        var timer = null;
        return function () {
            var context = this, args = arguments;
            clearTimeout(timer);
            timer = setTimeout(function () {
                fn.apply(context, args);
            }, delay);
        };
    }
    var scrollervateira = debounce(function (event) {
        if (event.originalEvent.wheelDelta >= 0) {
            $('.flexhome').flexslider('prev');
            console.log('passa_slide');
            return false;
        } else {
            $('.flexhome').flexslider('next');
            console.log('volta_slide');
            return false;
        }
    }, 250);
    $(window).bind('mousewheel', scrollervateira);
}
;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

The executar_whell function will not be able to work when I click on a div ( div onclick=outright) and when I click on another div ( div onclick-work) it will work again.

  • If you put more code it is possible to help more, but for this feature you can use a flag, or remove Event Handler and put again with .on() and .off(), or Bund/unbind. One aside: this function defection function debounce(fn, delay) { you don’t need to be inside executar_whell. It’s kind of confusing being there.

2 answers

2


you can use the addEventListener to activate the event and the removeEventListener to remove the event.

follows an example with the event mousemove.

var x = document.getElementById("x");
var y = document.getElementById("y");
var track = document.getElementById("track");

var onMouseMove = function (event) {
  x.value = event.x;
  y.value = event.y;
}

track.addEventListener("click", function (event) {
  var ativo = track.dataset.ativo == "true";
  if (ativo) {
    track.dataset.ativo = false;
    track.value = "Ativar";
    window.removeEventListener("mousemove", onMouseMove);
  } else {
    track.dataset.ativo = true;
    track.value = "Desativar";
    window.addEventListener("mousemove", onMouseMove);
  }
});

window.addEventListener("mousemove", onMouseMove);
<div>
  <label>
    X:
    <input id="x" type="text" />
  </label>
</div>
<div>
  <label>
    Y:
    <input id="y" type="text" />
  </label>
</div>
<div>
  Track Mouse: 
  <input id="track" type="button" value="Desativar" data-ativo="true" />
</div>

  • That’s right, I’ll just change, thank you!

1

As a complement to the Tobymosque answer, I leave an option with a very similar effect, but done in Jquery.

To add an event in jquery you can use the .bind(), already to remove this event can use the .unbind(). See Jsfiddle below:

Jsfiddle

A very simple code as an example:

$('input:text').bind('keyup', function(){
  $('span').text(this.value);
})
$('input:button').click(funtion(){
  $('input:text').unbind('keyup');
})

With the unbind() it is also possible to specify the function in question to be removed along with the event. For example: unbind('keyup', escrever), thus the function escrever() will no longer be executed in the event keyup.

I didn’t use the Stack Snippet because I’m on mobile.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.