Is it possible to disable a certain action of an HTML element with a certain class via jQuery?

Question

On my startup I know that all links should block, using the plugin jquery-blockui, the screen to avoid multiple clicks of impatient user avoiding multiple and unnecessary server requests.

$("a").on("click", $.blockUI);

I had a problem I reported in the question Different multiple select rendering for each browser and I ended up accepting as answer and the only answer given and using the solution given in the first option of the update of this same answer, but this widget uses links to mark all options, uncheck all options or close it and this triggers my event above. I tried to use to stop the event the code below:

$("a.ui-multiselect-none, a.ui-multiselect-all, a.ui-multiselect-close").on("click", function(e) {
    e.preventDefault();
});

That is, I tried to stop the default link action in the links with the classes used by the widget, but this did not work. What actually worked was what I used below:

$("a.ui-multiselect-none, a.ui-multiselect-all, a.ui-multiselect-close").on("click", $.unblockUI);

But this solution gives an effect on the screen as if it had flashed. Is there any way to make these links simply do not trigger blockUI differently than others being a system UX exception?

Answer 1

The answer would be not to link the event to the links as below:

$("a:not(.ui-multiselect-none, .ui-multiselect-all, .ui-multiselect-close)").on("click", $.blockUI);

Source: https://stackoverflow.com/questions/21944117/can-you-disable-override-certain-action-of-an-html-element-with-given-class-via/21944261#21944261

Answer 2

You returning a false value will prevent the default link and other events option as well:

$("a.ui-multiselect-none, a.ui-multiselect-all, a.ui-multiselect-close").on("click", function(e) {
    return false;
});

But if you want to avoid only the action of other events, keeping the default link action use this:

$("a.ui-multiselect-none, a.ui-multiselect-all, a.ui-multiselect-close").on("click", function(e) {
    e.stopPropagation();
});

Still, it may occur, depending on the way your code is organized, that the above function does not prevent the default link action from being disabled by other functions.
In this case use the first option, with a change: before the return false simulate the default link action with window.location.replace(this.href);.

Yet, one last alternative:

$("a").on("click", function () {
  var classes = 'ui-multiselect-none ui-multiselect-all ui-multiselect-close'.split(' ');
  while (classes.length) {
    if (this.hasClass(classes.pop())) {
      return true;
    }
  }
  $.blockUI();
});