js/button.js
| ((13 lines not shown)) | ||
| 100 | 109 | // BUTTON DATA-API |
| 101 | 110 | // =============== |
| 102 | 111 | |
| 103 | - $(document).on('click.bs.button.data-api', '[data-toggle^="button"]', function (e) { | |
| 104 | - var $btn = $(e.target) | |
| 105 | - if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn') | |
| 106 | - Plugin.call($btn, 'toggle') | |
| 107 | - e.preventDefault() | |
| 108 | - }) | |
| 112 | + $(document) | |
| 113 | + .on('click.bs.button.data-api', '[data-toggle^="button"]', function (e) { | |
| 2 |
Why is/was it 
hnrch02
added a note
Because of button groups, they toggle via
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
|
|
I guess we can't do much at this time about the disability to focus radio inputs, right?
@mdo Yeah, that's what I was trying to explain. Only the first radio button can be targeted by tabbing: http://jsbin.com/cubiy/1 Anything else that didn't work for you?
@hnrch02 in your demo: http://jsbin.com/fikul/5/edit
when you tab to the radio, you just use your keyboard left, right, etc.…
i believe that is expected for radio inputs, accessibility, etc. but i could be mistaken
Oh wow, I see, wasn't aware of that. I guess then it's good to go 
Ohhhhhh snap. 
As far as I can tell they are receiving focus styles.
Damn beta software. I wonder if Chrome is changing how it handles focus? I see what I posted in my screenshot without issue.
Lol.
Showing 1 changed file with 22 additions and 6 deletions. Show diff stats
| @@ -97,14 +97,30 @@ | ||
| 97 | 97 | } |
| 98 | 98 | |
| 99 | 99 | |
| 100 | + // FOCUS SHIM (FOR BUTTON GROUPS) | |
| 101 | + // ============================== | |
| 102 | + | |
| 103 | + function getBtnTarget(target) { | |
| 104 | + var $target = $(target) | |
| 105 | + return $target.hasClass('btn') ? $target : $target.parent('.btn') | |
| 106 | + } | |
| 107 | + | |
| 108 | + | |
| 100 | 109 | // BUTTON DATA-API |
| 101 | 110 | // =============== |
| 102 | 111 | |
| 103 | - $(document).on('click.bs.button.data-api', '[data-toggle^="button"]', function (e) { | |
| 104 | - var $btn = $(e.target) | |
| 105 | - if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn') | |
| 106 | - Plugin.call($btn, 'toggle') | |
| 107 | - e.preventDefault() | |
| 108 | - }) | |
| 112 | + $(document) | |
| 113 | + .on('click.bs.button.data-api', '[data-toggle^="button"]', function (e) { | |
| 114 | + var $btn = $(e.target) | |
| 115 | + if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn') | |
| 116 | + Plugin.call($btn, 'toggle') | |
| 117 | + e.preventDefault() | |
| 118 | + }) | |
| 119 | + .on('focus.bs.button.data-api', '[data-toggle^="button"]', function (e) { | |
| 120 | + getBtnTarget(e.target).addClass('focus') | |
| 121 | + }) | |
| 122 | + .on('blur.bs.button.data-api', '[data-toggle^="button"]', function (e) { | |
| 123 | + getBtnTarget(e.target).removeClass('focus') | |
| 124 | + }) | |
| 109 | 125 | |
| 110 | 126 | }(jQuery); |
Tip: You can add notes to lines in a file. Hover to the left of a line to make a note
possible solution for #12145.
bit tired tho so might have missed something…
similar to @hnrch02 – except uses focus/blur instead of focusin/focusout. I was going to use the latter, but read firefox doesn't support them (https://developer.mozilla.org/en-US/docs/Web/Events/focusout)… and this appears to work, even though i thought they didn't bubble
weird.
went back and forth with toggle class, but ultimately thought it might be safer to tie specific events to specific actions