You have defined two behaviors for the click event of the

• $('body').on('click', '[data-link]', function() { ... });
• $('button').click(function () { ... });

The javascript will adopt one or the other, in your case, when you call the button click is invoking the last declared $('button').click(function () { ... }); , at no time will call the first option.

How to solve this problem?

Declare all your function in just one event, it might look like this:

$("body").on('click', '[data-link]', function() {
  var enderecoLink = $(this).data('link');
  if (enderecoLink)
    document.location.href = enderecoLink;

  $(this).prop('disabled', !$(this).disabled);
});

How do I know which function is being called?

You can use the browser's debug options and add% with%.

Location.href function

The location.href will redirect the user (on the same tab) to the address you set, or the button that was clicked will no longer exist, because it will be in a new address / site / url ...

To continue on your page and open a new one, use window.open instead of break points

$("body").on('click', '[data-link]', function() {
  var enderecoLink = $(this).data('link');
  if (enderecoLink)
    window.open(enderecoLink);

  $(this).prop('disabled', !$(this).disabled);
});

Documentation is the best place for you to get information and learn how to use the resources you are using, so read without fear. :)

Hugo, would not that help you?

$("body").on('click', '[data-link]', function() {

  console.log($(this).data('link'));
  // Verifica se tem link
  if (typeof $(this).data('link') !== 'undefined') {
    document.location.href = $(this).data('link');
  }

  if (!$(this).disabled) {
    // Desabilita o botao
    $(this).prop('disabled', true);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><buttontype='submit'data-link="http://www.google.com">OK</button>

<br>
<Br><br><br>

<div data-link="http://www.google.com">OK</div>