I have a problem and I can't figure out what exactly is causing this behavior. I cannot access my input fields and textarea
s 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 ;-)
The autofocus attribute is a boolean attribute. When present, it specifies that an <input> element should automatically get focus when the page loads.
To set focus to an HTML form element, the focus() method of JavaScript can be used. To do so, call this method on an object of the element that is to be focused, as shown in the example. Example 1: The focus() method is set to the input tag when user clicks on Focus button.
To check if an input field has focus with JavaScript, we can use the document. activeElement property to get the element in focus. to add an input. to check if the input element is focused.
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With