John
John

Reputation: 9

How to disable a button after onclick event?

I want to disable this button after the onclick function, so either change the z-index, or disable the button, any ideas?

 <button id ="a" type="button" 
           onclick="window.open('https://www.google.ca')"
           >

Thanks.

Upvotes: 0

Views: 6049

Answers (5)

Jeffrey Andrews
Jeffrey Andrews

Reputation: 1

this is my first time posting, so forgive a noob if I don't get the format correct. I needed to be able to easily turn a button on and off to 'guide' the user to perform actions in the correct order, and this post helped me in that journey, although I only used part of the answer. I made two functions 'enableClick()' and 'disableClick()', where the parameter is the id of the button, eg: 'enableClick("betButton")' Here is the code:

function disableClick (elementId) {
  const x = document.getElementById(elementId);
  x.disabled = true;
}

I'm learning js, so everything I'm doing is vanilla at this point on purpose, but it's still fairly simple - obviously, with the enableClick function, the value of x.disabled would be 'false'. These functions can be added inside a function called by a click, after the initial click functionality is complete, so that the button can't be clicked again until the opposite function is called.. love this stuff!

Upvotes: 0

Barney Stinson
Barney Stinson

Reputation: 1002

i would take a look at jquery https://api.jquery.com/click/

$( "#a" ).click(function() {
  // do your stuff opening a page etc
  $( "#a" ).prop("disabled",true);
});

edit:// take Rohit Saxena's approach

Upvotes: 0

Rohit Saxena
Rohit Saxena

Reputation: 667

You need to add this.disabled=true after opening the window.

 <button id ="a" type="button" 
       onclick="window.open('https://www.google.ca'); this.disabled=true;"
       >

Upvotes: 3

Tien
Tien

Reputation: 137

The approach is that you should create a script contain function that does two jobs:

  • make that button disable using selectById() and adding attribute disabled

  • then window.open()

Upvotes: 0

Emma Earl Kent
Emma Earl Kent

Reputation: 578

Code above needs 'disabled' instead of 'disable.' Try this:

<button id ="a" type="button" 
   onclick="window.open('https://www.google.ca'); this.disabled=true;"
>

Upvotes: 0

Related Questions