disable double click across site?

Asked

Viewed 2,321 times

2

Is it possible to disable double-click on the entire site and any element? Is this possible with jQuery or HTML? I want to prevent the user from 2 clicks in a row on links, buttons and etc.

javascript jquery html

  • You want to prevent the user from selecting text on your system/system?

  • At first yes it is possible but what if the user disables JS in the browser? What should be the behavior of the site?

  • If the problem is to click 2x on a button and not on text it would be better to disable the link/button after the first click, what do you think?

  • 1

    I think it’s a bad idea. Let the browser follow its default behavior, let html fulfill its function... Blocking additional clicks in the browser seems to be enough to solve a problem that should be solved elsewhere - and not guarantee anything for several reasons (javascript can be breached in the browser, can be disabled, can be broken by an error and the lock can not be implemented...). I think the ideal is for the system to do what it has to do on the first click and not let additional clicks corrupt the data.

  • @jean cool serial display a message to the user. After all JS has to be mandatory, because the entire front end is done with jquery.

  • @Rafaelacioly com to disable the links and buttons after the first click?

  • @Caffé Exactly! Unfortunately comment are not the place p/ chat but it was right there where I wanted to get. OP may be able to disable double click but this has big change generate problems in the future while a data entry treatment would be more correct

  • @Caffé although I agree - in part - with you, I am also in favor of avoiding double clicks in some situations. Imagine that you will send a librarian to create an account. I see no problem in blocking the button at the first click, until it can be used to give visual feedback to the user, improving the UX, informing that its action has been executed and is being processed. But finally, they are opinions and development options, just to show another vision for the "problem".

  • @That wasn’t the question, was it? The question says "all over the site" including links, which would be the opposite of giving a good user experience. If there is an ajax request on a button, for example, you can easily disable this button and still include an activity indicator in progress during the ajax request. Disabling the entire site as the question says or even giving that faded on the screen disabling any interaction only happens in the worst sites we use around. And if not during ajax request but yes during page or navigation Ubmit, even worse.

  • @Caffé yes. That’s why I said I agree with you in part and in favor of blocking only in some situations.

Show 5 more comments

1 answer

3


You can disable the element button e.g. after the click and enable it again after 2 seconds (eg.)

function myFunction(e) {
    document.getElementById("linha").innerHTML += "<p>adicionado linha</p>";

    //Desabilita o botao
    e.disabled = true;
    
    //Habilita novamente após dois segundos (2000) ms
    setTimeout(function(){
      toggleDisabled(e)
    },2000);
}

function toggleDisabled(elem){
  elem.disabled = !elem.disabled;
}
<p>Texto de testes</p>
<button onclick="myFunction(this)" id="btn">Clique</button>
<div id="linha"></div>

  • Or at the end of the function (or of some ajax request, for example), that would be the most ideal, because not only disables the double click but avoids a new click in case of delay in the execution of the function.

  • andrepaulo your idea is very good, is exactly what I’m wanting. However I need to ask a question, how can I use it in all tags button and within a link like this: <div onclick="document.location='pagina.html'">menu</div>?

  • As commented in the question that is used jQuery, I think it is worth editing the answer to jQuery, will greatly simplify the code.

Browser other questions tagged javascript jquery html

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