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

Have Carousel ignore keyboard events from <input>s or <textarea>s; fixes #14991

Browse Source
This commit is contained in:
Chris Rebert 2014-11-03 18:35:35 -08:00
parent 425a985491
commit 469dc3ab1f
2 changed files with 43 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
js/carousel.js
View File

@ -42,6 +42,7 @@
}
Carousel.prototype.keydown = function (e) {
if (/input|textarea/i.test(e.target.tagName)) return
switch (e.which) {
case 37: this.prev(); break
case 39: this.next(); break

42
js/tests/unit/carousel.js
View File

@ -478,6 +478,48 @@ $(function () {
strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press')
})
test('should ignore keyboard events within <input>s and <textarea>s', function () {
var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">'
+ '<div class="carousel-inner">'
+ '<div id="first" class="item active">'
+ '<img alt="">'
+ '<input type="text" id="in-put">'
+ '<textarea id="text-area"></textarea>'
+ '</div>'
+ '<div id="second" class="item">'
+ '<img alt="">'
+ '</div>'
+ '<div id="third" class="item">'
+ '<img alt="">'
+ '</div>'
+ '</div>'
+ '</div>'
var $template = $(templateHTML)
var $input = $template.find('#in-put')
var $textarea = $template.find('#text-area')
strictEqual($input.length, 1, 'found <input>')
strictEqual($textarea.length, 1, 'found <textarea>')
$template.bootstrapCarousel()
strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
$input.trigger($.Event('keydown', { which: 39 }))
strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <input>')
$input.trigger($.Event('keydown', { which: 37 }))
strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <input>')
$textarea.trigger($.Event('keydown', { which: 39 }))
strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <textarea>')
$textarea.trigger($.Event('keydown', { which: 37 }))
strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <textarea>')
})
test('should only add mouseenter and mouseleave listeners when not on mobile', function () {
var isMobile = 'ontouchstart' in document.documentElement
var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false" data-pause="hover">'