How to prevent jquery click function?

Question

On this page http://jsfiddle.net/wQhaH/1/ I try this:

User can click up to 3 time any where of document include link, buttons etc. After 3 click, I want to prevent user to click ANY OBJECT ON THE SCREEN. You can think all page elements are blocked.

I tryed e.preventDefault() function but it doesn't work. Can we do this?

Esailija · Accepted Answer · 2011-11-27 02:08:37Z

2

Try this:

http://jsfiddle.net/wQhaH/2/

var count = 0;
$(document).click(function(e) {
    count++;
    if(count > 2) {
        $("body").append('<div class="block-ui">');
        $(document).unbind("click");
    }
    $('#log').html( $('#log').html() + "Clicked Document !<br>" );
});

$("#mylink").click(function(event) {
    $('#log').html( $('#log').html() + "Clicked !<br>" );
});

answered Nov 27, 2011 at 2:08

Esailija

140k24 gold badges280 silver badges328 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Shawn31313 Over a year ago

Very Nice. I see what your doing. Your just breaking the webpage. By adding an free HTML element. Haha, very smart thinking. Would of never of thought of that ;)

Esailija Over a year ago

@Shawn31313, I actually use similar with ajax requests when it doesn't make sense to let the user interact while the ajax request is still going :P

anson · Accepted Answer · 2011-11-27 02:20:26Z

1

Use the unbind() function in jquery

http://api.jquery.com/unbind/

if(count > 2){
  $('*').unbind('click');
  $(document).unbind('click');
}

This will unbind click events from all elements of the DOM. The '*' selector selects all elements but not the document, so you have to also unbind from the document if you have any click handlers binded to the document.

answered Nov 27, 2011 at 2:20

anson

4,1742 gold badges25 silver badges30 bronze badges

2 Comments

Nuri Akman Over a year ago

I don't want to unbind or any other solution. I want to use preventDefault.

anson Over a year ago

In that case, I don't understand what you expect to achieve. Using preventDefault inside of the document click handler won't stop anything inside the document from firing, as those events fire first then bubble up to the document, which fires last. Using unbind will definitely work and is the best solution. The only other way is to switch a global variable to false when the document click reaches 3, and then wrap each other click event in an if statement that asks if the global var is true.

Collectives™ on Stack Overflow

How to prevent jquery click function?

2 Answers 2

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related