Wie kann man anklickbar <tr> zugänglich machen?

Question

Ich habe eine Tabelle. dass alle <tr> öffnen Sie die <tr> darunter. Wie kann ich es für den Benutzer zugänglich machen? Das kann er wissen <tr> ist anklickbar und öffnen Sie die <tr> darunter.

Ex:

Der Benutzer (der Leser verwenden Bildschirm) müssen wissen, dass, wenn er klicken

<tr class="infoBlock" data-id="t1"> 

offen

<tr class="detailsBlock" data-id="t1"> 

Ich weiß, dass Arie -expanded Attribut kann auf <button> undverwendet werden https://www.w3.org/WAI/GL/wiki/Using_the_WAI-ARIA_aria-expanded_state_to_mark_expandable_and_collapsible_regions

Answer 1

Ihre Verwendung für Layout Zweck eine Datentabelle

Diese mühsam zugänglich wäre.

Answer 2

<table> 
 
    <thead> 
 
    <tr> 
 
     <th scope="col">bla1</th> 
 
     <th scope="col">bla2</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr class="infoBlock"> 
 
     <td scope="row" aria-label="Click to expand 1"><label aria-label="Click to expand">Hello</label></td> 
 
     <td scope="row" aria-label="Click to expand 2"><label aria-label="Click to expand">Boss</label></td> 
 
    </tr> 
 
    <tr class="detailsBlock"> 
 
     <td scope="row"> Hey</td> 
 
     <td scope="row"> Bro</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Sie können innerhalb der td mit aria-Label label oder ein beliebiges anderes Element verwendet werden.

kann es vom Bildschirmleser gelesen werden.