Disable Form Elements Using Event Capturing

Question

Is it possible to make form elements unusable without setting the disabled property for each element?

My idea was this:

container.addEventListener('click', function(e) {
    e.stopPropagation();
    e.preventDefault();
}, true);

It behaves as intended for non form elements but it won't stop e.g. select elements from showing their options when clicked.

Answer 1

The select will be open after the mousedown event so this is the event you have to stop. http://jsfiddle.net/6K9Mj/