Disable click after x times

disable button
javascript disable button onclick
disable button and enable it after specified time
javascript disable onclick after click
disable button after click jquery
how to disable a button in javascript based on condition
jquery disable button click event
bootstrap disable button after click

Let's say the user is able to click a button (div) 7 times. After clicking it 7 times, the button must disappear or become non clickable. How can I do this?

This should work although you'll need to flesh out some details yourself. The button:

<div class="button">button</div>

The JS:

$('div.button').click(function() {
  var tally = ($(this).data('clicks') || 0) + 1;
  if ( tally < 7 ) {
    $(this).data('clicks', tally);

I've simply stopped processing the click, but you can hide the button of course without too much effort.

How to disable buttons after x amount of clicks in js?, This is happening because each time the onclick event is fired, your var count is being assigned to 0, so it will never be greater than or equal to  After some research I found the way in how to disable the button for X time after the user click it. Button "Click" - > The user clicks the button, do the action. After that the text "Click" changes to "2:00 minutes left", "1:59 minutes left" "55 seconds left" and so on. When it reaches 0, it will be enabled again.

Something like this should work:

$('button').data('count', 0).on('click', function (e) {
    var $t = $(this),
        count = ++($t.data('count'));

    // kill it with fire
    if (count === 7) {

    // increment the count


This way, you avoid global variables and keep your count associated to the particular elements it pertains to. (Just imagine if you have hundreds of these buttons!)

Disable Button for X minutes, After some research I found the way in how to disable the button for X time after the user click it. But I would want the button shows the left time  After the user clicks on the button, that button is disabled, and its text is changed, then, after 2 seconds, the button is automatically enabled. - This function receives an Array with the ID of the buttons to which you want to add this effect.

There are at least two methods of doing this...

Using closure

Just define variable outside the event handler and increase it with every click. Then just check what value it has. It could look like this:

// method 1 - using closure
    var click_counter = 0;
    jQuery('#link1').on('click', function(event){
        var el = jQuery(this);
        click_counter += 1;
        if (!el.hasClass('inactive')){
            // should be activated
            alert('Clicked the link ' + click_counter + ' time(s)');
        if (click_counter >= 7){
            // deactivate
Associating click counter to the element using jQuery.data()

You can also use one of the jQuery's features for attaching data to the elements. It could look like this:

// method 2 - using jQuery.data()
jQuery('#link2').on('click', function(event){
    var el = jQuery(this);
    var click_counter = (el.data('click-counter') || 0) + 1;
    el.data('click-counter', click_counter);
    if (!el.hasClass('inactive')){
        // should be activated
        alert('Clicked the link ' + click_counter + ' time(s)');
    if (click_counter >= 7){
        // deactivate
Live examples

You can see both codes work correctly - just follow this link to the demo: http://jsfiddle.net/3wt8h/

Disclaimer for jQuery < 1.7

If your version of jQuery is older than 1.7, you will not have .on() function available. Just use .bind() instead, it should work exactly the same.

Teach Yourself VISUALLY OS X El Capitan, 8 Click the Disable automatic login check box ( changes to ). then use the spin box to set the amount of idle time after which OSX logs you out automatically. And disable this Command Button after the copying and pasting. Please do as follows. 1. Turn on the Design Mode under the Developer tab by clicking Developer > Design Mode. See screenshot: 2. Right click on the Command Button which has been assigned with VBA script, and then click View Code from the context menu. 3.

  1. add a click handler to the div
  2. each time the user clicks increment a global count.
  3. when the count === 7, set the visible css class to hidden.

How to disable "Submit" button and multiple submissions?, Having problems with a ticket being submitted multiple times? This article will show you how to disable the Submit button after it has been click and change the​  jQuery off () method is used to remove event handler from the element attached with the on () method. Use off () method after click event is triggered to disable element for the further click. $ (' #clickElement ').off ( 'click' ); The following code snippet is a real-time example for disabling click event using jQuery.

The short answer is to increment a variable as part of the click action to keep track of the number of times the button has been clicked.

You should avoid having this variable be global. You can do this by declaring the variable within the scope of a function, and have that function set up the click behavior.

With jQuery:

function initClick () {

    var clickCounter = 0;

    jQuery('#myLink').click(function (e) {
        if (clickCounter >= 7) {
        // do stuff



Mac OS X Power Tools, NOTE At the time 0)' this writing, there's also an option in the Security pane of System login option: “Show Password Hint after Three Attempts to Enter a Password. OS X 10.3 (Panther) also has such functionality; however, it's enabled/ disabled for Simply click the Enable button, and password hints will be reset to their  The location of the setting where you enable the single-click of icons to open them always escapes me. I can never find it when I want to change it on my Mom’s computer. Single-click irritates me, but here’s how to enable or disable it in Microsoft Windows 10, 8, 7, Vista and XP.

jQuery - How to disabled submit button after clicked, Often times, users like to press a few times on the submit button to make sure the button is surely clicked, and causing the double form  If you disable tap-to-click, you can still click by depressing the trackpad or pressing the buttons on it. Many modern Windows laptops have Precision Touchpads . If your laptop does, you can configure tap-to-click and other touchpad settings directly in Windows 10’s Settings app.

Element: click event, click fires after both the mousedown and mouseup events have fired, handler for click has its detail property set to the number of times the  jquery disable button after click, jquery disable button on submit The default behavior of a submit button obvious – clicking it submits the contents of a form to the server. This seems quite straightforward.

click, Syntax.click() .click(options) .click(position) .click(position, options) .click(x, y) .​click(x timeout, defaultCommandTimeout, Time to wait for .click() to resolve before SHIFT will not be released after the type command cy.get('body').type('{​shift}',  Ahhmm. Of course it makes sense. Links might temporarily be unavailable or unavailable under certain conditions or time frames. Insisting it must be a link send odd. A disabled button will do the trick without all the mess. Just style it as an inline link! *Drops the mic

  • Make it into a jQuery plugin! I posted a .nth() function once, which was like one() but for n clicks.
  • When I try this code I get Uncaught ReferenceError: Invalid left-hand side expression in prefix operation on 'count = ++$t.data('count');'.
  • Also where is the count incremented? I am missing a line '$t.data('clicks', newCount);' somewhere in the code
  • @Olle ~ woops! sorry about that! :D updated the code to increment the count.
  • @Blender ~ now that is a great idea. :D