1

Estou com dificuldades em bloquear cliques simultâneo nos itens do menu na minha aplicação, quando o usuário clicar a primeira vez eu quero que bloqueia as tentativas de novos cliques, quero fazer isso pois tem um usuário clicando umas 100 vezes em item do menu que demora uns 15 segundos para carregar e está sobrecarregando o sistema.

Segue exemplo do código html e do javascript que estou tentando usar para bloqueio.

$(document).ready(function () {
    $('a').on('click', function () {
        $(this).attr('disabled', true);
        $(this).addClass("disabled");
        $(this).prop("onclick", null).off('click');;
    });
});
<ul class="dropdown-menu">
    <li>@Html.ActionLink("Teste", "Index", "Teste")</li>                       
</ul>
2
  • Você precisa desabilitar os clicks simultâneos em apenas um link ou todos os elementos <a> de sua página?
    – wmarquardt
    3/10/2016 às 2:52
  • isso @WilliamMarquardt
    – Zica
    3/10/2016 às 4:06

2 Respostas 2

1

Você pode fazer isso de duas maneiras.

Usando classe (ou até mesmo atributo - basta definir seu css assim a[disabled] {...}) com a propriedade pointer-events.

.disabled {
    pointer-events: none;
}   
<a href="#id" onclick="alert('Ola');">Clique funciona</a>
<br />
<a href="#id" class="disabled" onclick="alert('Ola');">Clique não funciona</a>

Ou utilizando preventDefault() através do evento clique.

$(document).ready(function () {
    $('a').on('click', function (event) {
        //Verifica se ele já possui o atributo disabled
        if ($(this).is("[disabled]")) {
            return event.preventDefault();
        }

        //Adiciona o atributo disabled
        $(this).attr("disabled", "disabled");
        alert('jQuery');
    });
});

Veja este exemplo funcionando: http://jsfiddle.net/o2gxgz9r/68/

0

Não sei se resolve seu problema, mas se sua tag a esta criando um href e redirecionando para uma nova pagina, porém como demora quer remover a ação, poderia remover o "href" da tag após o click.

tente isso:

$(document).ready(function () {
    $('a').on('click', function(){
        $(this).removeAttr('href');
    });
});
1
  • Se eu remover o href ele não entra na página. Fiz uma gambiarra que funcionou, criei uma variavel que remove o href se executar o método pela segunda vez. Será que existe uma forma melhor de resolver essa questão? @IronManBR
    – Zica
    3/10/2016 às 3:43

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .