rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-29 11:24:18 +01:00
Code Issues Actions Packages Releases Activity

Merge pull request #14208 from twbs/mckramer-dropdown-aria

Browse Source 
Mckramer dropdown aria
This commit is contained in:
Jacob 2014-07-21 22:48:08 -07:00
commit f88e6ba2a3
2 changed files with 18 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
docs/_includes/js/dropdowns.html
View File

@ -20,7 +20,7 @@
<div class="collapse navbar-collapse bs-example-js-navbar-collapse">
<ul class="nav navbar-nav">
<li class="dropdown">
<button id="drop1" type="button" class="dropdown-toggle" data-toggle="dropdown">
<button id="drop1" type="button" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown
<span class="caret"></span>
</button>
@ -33,7 +33,7 @@
</ul>
</li>
<li class="dropdown">
<button id="drop2" type="button" class="dropdown-toggle" data-toggle="dropdown">
<button id="drop2" type="button" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown 2
<span class="caret"></span>
</button>
@ -48,7 +48,7 @@
</ul>
<ul class="nav navbar-nav navbar-right">
<li id="fat-menu" class="dropdown">
<button id="drop3" type="button" class="dropdown-toggle" data-toggle="dropdown">
<button id="drop3" type="button" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown 3
<span class="caret"></span>
</button>
@ -71,7 +71,7 @@
<ul class="nav nav-pills" role="tablist">
<li role="presentation" class="active"><a href="#">Regular link</a></li>
<li role="presentation" class="dropdown">
<button id="drop4" type="button" data-toggle="dropdown">
<button id="drop4" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown
<span class="caret"></span>
</button>
@ -84,7 +84,7 @@
</ul>
</li>
<li role="presentation" class="dropdown">
<button id="drop5" type="button" data-toggle="dropdown">
<button id="drop5" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown 2
<span class="caret"></span>
</button>
@ -97,7 +97,7 @@
</ul>
</li>
<li role="presentation" class="dropdown">
<button id="drop6" type="button" data-toggle="dropdown">
<button id="drop6" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown 3
<span class="caret"></span>
</button>
@ -122,7 +122,7 @@
<p>Add <code>data-toggle="dropdown"</code> to a link or button to toggle a dropdown.</p>
{% highlight html %}
<div class="dropdown">
<button id="dLabel" type="button" data-toggle="dropdown">
<button id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown trigger
<span class="caret"></span>
</button>
@ -134,7 +134,7 @@
<p>To keep URLs intact with link buttons, use the <code>data-target</code> attribute instead of <code>href="#"</code>.</p>
{% highlight html %}
<div class="dropdown">
<a id="dLabel" data-target="#" href="http://example.com" type="button" data-toggle="dropdown">
<a id="dLabel" data-target="#" href="http://example.com" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown trigger
<span class="caret"></span>
</a>

12
js/dropdown.js
View File

@ -42,7 +42,9 @@
if (e.isDefaultPrevented()) return
$this.trigger('focus')
$this
.trigger('focus')
.attr('aria-expanded', 'true')
$parent
.toggleClass('open')
@ -88,11 +90,17 @@
if (e && e.which === 3) return
$(backdrop).remove()
$(toggle).each(function () {
var $parent = getParent($(this))
var $this = $(this)
var $parent = getParent($this)
var relatedTarget = { relatedTarget: this }
if (!$parent.hasClass('open')) return
$parent.trigger(e = $.Event('hide.bs.dropdown', relatedTarget))
if (e.isDefaultPrevented()) return
$this.attr('aria-expanded', 'false')
$parent.removeClass('open').trigger('hidden.bs.dropdown', relatedTarget)
})
}