Question

I have a problem and I can’t figure out what exactly is causing this behavior. I cannot access my input fields and textareas on my HTML form.

Unfortunately, the JS, HTML and CSS are very large, so I can’t really post it all here.

Can anybody tell me what to look for when debugging this strange behavior?

UPDATE

If I move the cursor over the input field I can see the text cursor, but when I click it the field does not get the focus. I can access the field via pressing the Tab key and if I right click on it and then click on the field I also get the focus for it.

…and nope, they don’t have the disabled or readonly attributes 😉

Answer 1

when i click it the field does not get the focus. i can access the field via pressing the “tab-key”

It sounds like you’ve cancelled the default action for the mousedown event. Search through your HTML and JS for onmousedown handlers and look for a line that reads.

return false;

This line may be stopping you from focusing by clicking.

---

Re: your comment, I’m assuming you can’t edit the code that adds this handler? If you can, the simplest solution is to just remove the return false; statement.

is there a way to just add functionality to the event-trigger by not overwriting it?

That depends on how the handler is attached. If it’s attached using the traditional registration method, e.g. element.onmousedown, then you could create a wrapper for it:

var oldFunc = element.onmousedown;
element.onmousedown = function (evt) {
    oldFunc.call(this, evt || window.event);
}

Since this “wrapper” doesn’t return false, it will not cancel the default action (focusing) for the element. If your event is attached using an advanced registration method, such as addEventListener or attachEvent then you could only remove the event handler using the function name/reference and reattach it with a wrapped function similar to the above. If it’s an anonymous function that’s added and you can’t get a reference to it, then the only solution would be to attach another event handler and focus the element manually using the element.focus() method.