CINXE.COM

<!DOCTYPE html><html lang="en"><head><title>aria-controls_attribute (aria) | Accessibility Support</title><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="canonical" href="https://a11ysupport.io/tech/aria/aria-controls_attribute"><link rel="stylesheet" href="/stylesheets/style.css"><script src="/js/vendor/details-polyfill.js"></script><script src="/js/vendor/formdata.min.js"></script><script src="/js/head.js"></script></head><body><header role="banner"><a class="skip-nav" href="#main" id="skip-nav">Skip to main content</a><div class="logo-area"><div class="site-title"><a href="/">Accessibility Support</a></div><span>Will your code work with assistive technologies?</span></div><nav role="navigation"><ul><li><a href="/tests">All Tests</a></li><li><a href="/faq">FAQ</a></li><li><a href="/contribute">Contribute</a></li><li><a href="/learn">Learn</a></li><li><a href="/updates">Recent updates</a></li></ul></nav></header><main role="main" id="main" tabindex="-1"><div class="beta-warning"><p><strong>Important</strong>: This website does not attempt to establish a standard for how assistive technologies must behave. <a href="/faq">Read the FAQ for more information</a>. Additionally, this is a work in progress. <a href="https://github.com/accessibilitysupported/accessibilitysupported/issues/new">Please submit feedback or suggestions</a>.</p></div><div><div class="content"><h1>aria-controls attribute (aria)</h1><div class="current-support-container pa"><p>Screen Reader support level: partial (10/42)</p></div><h2>On this page</h2><ul class="link-list"><li><a href="#description">About this feature</a></li><li><a href="#age-of-results">Age of results</a></li><li><a href="#expectations">Expectations</a><ul><li><a href="#support-table-0">convey the presence of the aria-controls attribute</a></li><li><a href="#support-table-1">allow the user to jump to the controlled element</a></li></ul></li><li><a href="#related-tests">Related tests</a></li><li><a href="#at-browser-issues">Related AT or browser issues</a></li><li><a href="#feedback">Is something not right?</a></li></ul><h2 id="description">About this feature</h2><p><p>Identifies the element (or elements) whose contents or presence are controlled by the current element. See related aria-owns.</p> </p><h2 id="age-of-results">Age of results</h2><p>Results across all tests for this feature range from 2 years ago to 6 years ago. Detailed dates and version information can be found in <a href="#related-tests">associated tests</a>.</p><div class="caution"><h3>Caution</h3><p>Failing or partial results may be out of date. The oldest result is from 6 years ago. Consider running the <a href="#related-tests">associated tests</a> and contributing results.</p></div><h2 id="expectations">Expectations</h2><p><a href="/faq#what-are-expectations%3F">What are expectations?</a></p><div class="caution"><p>Important: The aria-controls attribute has expectations that are not directly testable by end users. Continue to use it if it is required by the specification, even if user-facing expectation support is poor. For more information, see <a href="/faq#what-about-expectations-that-are-not-directly-testable-by-users%3F">FAQ: What about expectations that are not directly testable by users?</a>.</p></div><h3 id="support-table-by-assertion-and-at-sr">Screen Reader support by expectation</h3><div class="responsive-table" tabindex="0"><table class="support-summary-table" aria-labelledby="support-table-by-assertion-and-at-sr"><col><colgroup span="3"></colgroup><colgroup span="1"></colgroup><colgroup span="3"></colgroup><colgroup span="1"></colgroup><colgroup span="1"></colgroup><colgroup span="1"></colgroup><colgroup span="1"></colgroup><tr><th rowspan="2">Expectation</th><th colspan="3" scope="colgroup">JAWS</th><th colspan="1" scope="colgroup">Narrator</th><th colspan="3" scope="colgroup">NVDA</th><th colspan="1" scope="colgroup">Orca</th><th colspan="1" scope="colgroup">TalkBack</th><th colspan="1" scope="colgroup">VoiceOver (iOS)</th><th colspan="1" scope="colgroup">VoiceOver (macOS)</th></tr><tr><th scope="col">Chrome</th><th scope="col">Edge</th><th scope="col">Firefox</th><th scope="col">Edge</th><th scope="col">Chrome</th><th scope="col">Edge</th><th scope="col">Firefox</th><th scope="col">Firefox</th><th scope="col">Chrome</th><th scope="col">Safari</th><th scope="col">Safari</th></tr><tr><th><a href="#support-table-0">SHOULD convey the presence of the aria-controls attribute</a></th><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td></tr><tr><th><a href="#support-table-1">MUST allow the user to jump to the controlled element</a></th><td class="support-case ye">supported</td><td class="support-case ye">supported</td><td class="support-case ye">supported</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td><td class="support-case no">none</td></tr></table></div><div class="assertion-container"><h3 id="support-table-0">Expectation: convey the presence of the aria-controls attribute</h3><h4>Rationale:</h4><p>Users need to be aware that an element has aria-controls functionality. If the presence of the attribute is not explicitly conveyed, then users may not be aware of the functionality. However, some screen readers may choose to not convey the presence by default since the controlled element is usually directly after the controlling element in the reading order and easily findable. In these situations, explicitly conveying the presence could be unnecessarily verbose.</p><h4>Strength of this expectation for different types of assistive technologies:</h4><ul><li>Screen Readers: SHOULD</li><li>Voice Control: NA</li></ul><h4>Notes:</h4><p>This is not a MUST requirement, because the functionality could still be discoverable via the screen reader's command to jump to the controlled element. If the command fails, the attribute is not present.</p><h4>Examples:</h4><ul><li>When supported, screen readers will often hint that an element controls another element, and may even announce the keyboard shortcut to jump to the controlled element</li><li>Most screen readers either do not support this attribute or the setting to convey the presence is turned off by default. This is because in the vast majority of cases, the controlled element is adjacent to the element with aria-controls, and thus announcing the presence is redundant and add extra verbosity.</li></ul><div class="responsive-table" tabindex="0"><table class="support-summary-table"><caption>Screen Reader support for 'SHOULD convey the presence of the aria-controls attribute'</caption><col><colgroup span="3"></colgroup><colgroup span="1"></colgroup><colgroup span="3"></colgroup><colgroup span="1"></colgroup><colgroup span="1"></colgroup><colgroup span="1"></colgroup><colgroup span="1"></colgroup><tr><th rowspan="2">Test</th><th colspan="3" scope="colgroup">JAWS</th><th colspan="1" scope="colgroup">Narrator</th><th colspan="3" scope="colgroup">NVDA</th><th colspan="1" scope="colgroup">Orca</th><th colspan="1" scope="colgroup">TalkBack</th><th colspan="1" scope="colgroup">VoiceOver (iOS)</th><th colspan="1" scope="colgroup">VoiceOver (macOS)</th></tr><tr><th scope="col">Chrome</th><th scope="col">Edge</th><th scope="col">Firefox</th><th scope="col">Edge</th><th scope="col">Chrome</th><th scope="col">Edge</th><th scope="col">Firefox</th><th scope="col">Firefox</th><th scope="col">Chrome</th><th scope="col">Safari</th><th scope="col">Safari</th></tr><tr><th scope="row"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example">APG Editable Combobox With List Autocomplete Example<span class="applied_to"> applied to: combobox role</span></a></th><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-aria-combobox_role-jaws-chrome">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-aria-combobox_role-jaws-edge">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-aria-combobox_role-jaws-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-aria-combobox_role-narrator-edge">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-aria-combobox_role-nvda-chrome">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-aria-combobox_role-nvda-edge">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-aria-combobox_role-nvda-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-aria-combobox_role-orca-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-aria-combobox_role-talkback-and_chr">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-aria-combobox_role-vo_ios-ios_saf">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-aria-combobox_role-vo_macos-safari">none</a></td></tr><tr><th scope="row"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example">APG Editable Combobox With List Autocomplete Example<span class="applied_to"> applied to: button element</span></a></th><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-jaws-chrome">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-jaws-edge">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-jaws-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-narrator-edge">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-nvda-chrome">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-nvda-edge">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-nvda-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-orca-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-talkback-and_chr">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-vo_ios-ios_saf">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-vo_macos-safari">none</a></td></tr><tr><th scope="row"><a href="/tests/apg__menu-button-actions-active-descendant">APG Actions Menu Button Example Using aria-activedescendant<span class="applied_to"> applied to: button element</span></a></th><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-jaws-chrome">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-jaws-edge">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-jaws-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-narrator-edge">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-nvda-chrome">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-nvda-edge">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-nvda-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-orca-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-talkback-and_chr">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-vo_ios-ios_saf">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-vo_macos-safari">none</a></td></tr><tr><th scope="row"><a href="/tests/tech__aria__aria-controls">aria-controls attribute<span class="applied_to"> applied to: button element</span></a></th><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-jaws-chrome">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-jaws-edge">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-jaws-firefox">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-narrator-edge">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-nvda-chrome">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-nvda-edge">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-nvda-firefox">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-orca-firefox">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-talkback-and_chr">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-vo_ios-ios_saf">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-convey_presence-html-button_element-vo_macos-safari">none</a></td></tr></table></div></div><div class="assertion-container"><h3 id="support-table-1">Expectation: allow the user to jump to the controlled element</h3><h4>Rationale:</h4><p>The controlled element might not be close to the element with aria-controls and the user might find it convenient to jump directly to the controlled element.</p><h4>Strength of this expectation for different types of assistive technologies:</h4><ul><li>Screen Readers: MUST</li><li>Voice Control: NA</li></ul><div class="responsive-table" tabindex="0"><table class="support-summary-table"><caption>Screen Reader support for 'MUST allow the user to jump to the controlled element'</caption><col><colgroup span="3"></colgroup><colgroup span="1"></colgroup><colgroup span="3"></colgroup><colgroup span="1"></colgroup><colgroup span="1"></colgroup><colgroup span="1"></colgroup><colgroup span="1"></colgroup><tr><th rowspan="2">Test</th><th colspan="3" scope="colgroup">JAWS</th><th colspan="1" scope="colgroup">Narrator</th><th colspan="3" scope="colgroup">NVDA</th><th colspan="1" scope="colgroup">Orca</th><th colspan="1" scope="colgroup">TalkBack</th><th colspan="1" scope="colgroup">VoiceOver (iOS)</th><th colspan="1" scope="colgroup">VoiceOver (macOS)</th></tr><tr><th scope="col">Chrome</th><th scope="col">Edge</th><th scope="col">Firefox</th><th scope="col">Edge</th><th scope="col">Chrome</th><th scope="col">Edge</th><th scope="col">Firefox</th><th scope="col">Firefox</th><th scope="col">Chrome</th><th scope="col">Safari</th><th scope="col">Safari</th></tr><tr><th scope="row"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example">APG Editable Combobox With List Autocomplete Example<span class="applied_to"> applied to: combobox role</span></a></th><td class="support-case ye"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-aria-combobox_role-jaws-chrome">supported</a></td><td class="support-case ye"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-aria-combobox_role-jaws-edge">supported</a></td><td class="support-case ye"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-aria-combobox_role-jaws-firefox">supported</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-aria-combobox_role-narrator-edge">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-aria-combobox_role-nvda-chrome">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-aria-combobox_role-nvda-edge">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-aria-combobox_role-nvda-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-aria-combobox_role-orca-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-aria-combobox_role-talkback-and_chr">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-aria-combobox_role-vo_ios-ios_saf">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-aria-combobox_role-vo_macos-safari">none</a></td></tr><tr><th scope="row"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example">APG Editable Combobox With List Autocomplete Example<span class="applied_to"> applied to: button element</span></a></th><td class="support-case ye"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-jaws-chrome">supported</a></td><td class="support-case ye"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-jaws-edge">supported</a></td><td class="support-case ye"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-jaws-firefox">supported</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-narrator-edge">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-nvda-chrome">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-nvda-edge">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-nvda-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-orca-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-talkback-and_chr">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-vo_ios-ios_saf">none</a></td><td class="support-case no"><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-vo_macos-safari">none</a></td></tr><tr><th scope="row"><a href="/tests/apg__menu-button-actions-active-descendant">APG Actions Menu Button Example Using aria-activedescendant<span class="applied_to"> applied to: button element</span></a></th><td class="support-case na"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-jaws-chrome">not applicable</a></td><td class="support-case na"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-jaws-edge">not applicable</a></td><td class="support-case ye"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-jaws-firefox">supported</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-narrator-edge">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-nvda-chrome">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-nvda-edge">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-nvda-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-orca-firefox">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-talkback-and_chr">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-vo_ios-ios_saf">none</a></td><td class="support-case no"><a href="/tests/apg__menu-button-actions-active-descendant#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-vo_macos-safari">none</a></td></tr><tr><th scope="row"><a href="/tests/tech__aria__aria-controls">aria-controls attribute<span class="applied_to"> applied to: button element</span></a></th><td class="support-case ye"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-jaws-chrome">supported</a></td><td class="support-case ye"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-jaws-edge">supported</a></td><td class="support-case ye"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-jaws-firefox">supported</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-narrator-edge">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-nvda-chrome">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-nvda-edge">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-nvda-firefox">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-orca-firefox">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-talkback-and_chr">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-vo_ios-ios_saf">none</a></td><td class="support-case no"><a href="/tests/tech__aria__aria-controls#assertion-aria-aria-controls_attribute-allow_jump_to_controlled-html-button_element-vo_macos-safari">none</a></td></tr></table></div></div></div><div class="sidebar"><h2 id="related-tests">Tests</h2><table aria-labelledby="related-tests"><tr><th>Test</th><th>Last update</th></tr><tr><td><a href="/tests/apg__aria-1-2-combobox-with-list-autocomplete-example">APG Editable Combobox With List Autocomplete Example</a></td><td>2023-08-22</td></tr><tr><td><a href="/tests/apg__menu-button-actions-active-descendant">APG Actions Menu Button Example Using aria-activedescendant</a></td><td>2021-11-10</td></tr><tr><td><a href="/tests/tech__aria__aria-controls">aria-controls attribute</a></td><td>2021-07-15</td></tr></table><h2 id="at-browser-issues">Related issues, discussions, and bugs</h2><ul><li><a href="https://github.com/w3c/aria/issues/995">ARIA: What to do about aria-controls</a></li></ul><h2 id="feedback">Is something not right?</h2><p>We use our <a href="https://github.com/accessibilitysupported/accessibilitysupported">GitHub repository</a> to manage our issue tracking. Please provide as much information as you can for issues, and please leave the id in the issue title intact.</p><a href="https://github.com/accessibilitysupported/accessibilitysupported/issues/new?title=aria/aria-controls_attribute&labels=tech%20feature">Create an issue for this feature</a><h2 id="related-features">References</h2><ul><li><a href="https://www.w3.org/TR/wai-aria-1.1/#aria-controls">ARIA spec for aria-controls</a></li></ul></div></div></main><footer role="contentinfo"><p>This work was originally created by Michael Fairchild. This is a community-driven and open source project. Text and data is available under the <a href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.</p><p><a href="https://github.com/accessibilitysupported/accessibilitysupported/">Find us on GitHub</a></p><script>// only show the focus outline for skip nav if a keyboard event triggered it. var skipnav = document.querySelector('#skip-nav'); var main = document.querySelector('main'); skipnav.addEventListener('click', function () { main.classList.add('show-focus-outline'); main.focus(); }); main.addEventListener('blur', function () { main.classList.remove('show-focus-outline'); });</script></footer></body></html>