To disable clicking inside a div with CSS or JavaScript, we can set the pointer-events CSS property to none .
Also, we can add a click event listener to the div and then call event.preventDefault inside.
For instance, if we have the following div:
<div id='foo'>
foo
</div>
Then we can disable clicks inside it with CSS by writing:
#foo {
pointer-events: none;
}
To disable clicks with JavaScript, we can write:
const foo = document.querySelector('#foo')
foo.addEventListener('click', (event) => {
event.preventDefault();
});
to select the div by its ID with document.querySelector .
Then we call addEventListener on it with 'click' and a click event handler that calls event.preventDefault to stop the default action when the div is clicked.
