CODEWITHSUNDEEP
javascripthtmlcssgridcell
Erie
Erie

Reputation: 45

JS: Is there a way to make a cell in a grid not clickable?

So I'm basically making a grid where a single click is a circle and a double click is a square. However, if I go back to an already clicked box and make a single or double click, it changes the shape in it. Is there a way to make an already clicked box not clickable anymore?

Here is my current code

Upvotes: 2

Views: 874

Answers (3)

Ben Mulford
Ben Mulford

Reputation: 41

I believe setting the CSS property 'pointer-events' to 'none' should work.

pointer-events: none;

Upvotes: 3

chriss
chriss

Reputation: 669

This should work

https://codesandbox.io/s/vn96m0o6l

Problem is that double click is still click. So it first triggers click handler than double click. That is why i set timeout of 200ms on click handler.

Double click handler also passes isDoubleClick flag so that handler knows what to do. And in handler based on that and class not existing yet decides which action to do. When click handler gets activated, element already has class and just ignores it.

Could be better, but will fix problem

Upvotes: 2

vinayak shahdeo
vinayak shahdeo

Reputation: 1488

Just add A variable after click and use this

if (isClicked = 1){ 
$(this).unbind("click");
}

or use vanilla js like this

document.getElementById("myElement").onclick = function() { return false; }

Upvotes: 1

Related Questions