Can multiple HTML elements receive focus at the same time?

Question

I'm a coding a JavaScript reporting component, that requires multiple LI's i.e. lists to be selected collectively as a bunch with visual feedback.

I'm thinking of adapting the onfocus event. Is it possible for multiple HTML elements to receive focus at the same time?

Not inputs, but DIVs, so I don't need the cursor. I just want several DIVs to be "selected" separately from others, colored differently to simulate multiple item selection.

Gehlbach

why you want do this with multiple onfocus!? simply call all you needs after a single onfocus event – Coe

he wants the cursor blinking in all 10 text inputs, duh </sarcasm> – Angloirish

Not necessarily inputs, but DIVs, so I don't need the cursor. – Gehlbach

Only saw your comment now. How can a "div" focus? onfocus is not an event of div w3schools.com/tags/tag_div.asp – Pasture

@Neb - IN HTML 4, you can validly assign a focus event listener to a div via javascript. In HTML5, onfocus is a valid event attribute for a div. Similarly, add attribute tabIndex="0" to add the div to the tab order. – Sennacherib

Answer 1

No, you can only focus on one element at a time.

Turbary

Yeah i had to edit it before any other answers were posted that way no suspicions of plagiarism will arise ;) – Turbary

I wonder is there any documentation about proving this? – Notornis

Answer 2

As the other answers state, only 1 element can have focus at any given time. What you could do instead is add a class to each of the 'selected' elements.

A simple example (using yui) would be:

 <style type="text/css">
     .selectedItem{border: 2px dashed #c0ffee;}
 </style>
...
<ul class='listContainer'>
     <li> ... </li>
     <li> ... </li>
     <li> ... </li>
</ul>
...
<script type="text/javascript">
     Y.one('.listContainer').delegate(
         'click', 
         function(e){ e.currentTarget.toggleClass('selectedItem');}, 
         'li'
     );
</script>

Peso

Answer 3

No. The whole point of focus is that one element is selected(as in a "spotlight" for it). But if you want double writing text boxes then use this

<input type="text" name="firstbox" onchange="firstbox.value = secondbox.value; return true;">
<input type="text" name="secondbox">

Pasture

Answer 4

I don't believe so. If two text fields had focus at the same time, which would receive the input? You can "simulate" this (one field has focus and code "duplicates" the values), but only one item at a time can be "the focus".

Trompe

Answer 5

No. An extensive answer from an accessibility point of view is that the Focus enables screen readers to identify and announce dynamic website features, conveying to users what is happening on the screen. If a webpage were to permit more than one focus at a time, it could disrupt the persistence of keyboard navigation and voice-over behavior, and your application would not comply with accessibility standards.

Gaziantep