Similar to what was mentioned with accesskey
, you can get onclick
to fire for hidden elements using label
elements.
When you click on <label for="some-id">
, the browser will look for the first input with that element and perform a click, even if hidden. A legitimate use-case for this feature is checkbox/radio inputs where the label is being used to indicate state, like the frequency selectors on this site's email settings page.
Imagine you had a form that looked like this:
<input type="text" style="display:none" value="" onclick="alert(1)">
<label for="field">Name</label>
<input type="text" id="field">
The value, " id="field
would result in a page looking like this:
<input type="text" style="display:none" value="" id="field" onclick="alert(1)">
<label for="field">Name</label>
<input type="text" id="field">
You will get an alert if the user clicks "Name". How often users click on the label will depend on a lot of things but some site designs may require clicking a label to accomplish a given task.
This is also heavily dependent on page ordering. The placement of the hidden input relative to the legitimate input matters, as well as whether the hidden input has an id and where it is relative to the value.