mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
Allow multiple delegated tooltip selectors on a node
Fixes #14167. Closes #14189 by merging it.
This commit is contained in:
parent
0521913a99
commit
1b3237629a
4 changed files with 95 additions and 8 deletions
|
@ -86,12 +86,18 @@
|
|||
|
||||
function Plugin(option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data('bs.popover')
|
||||
var options = typeof option == 'object' && option
|
||||
var $this = $(this)
|
||||
var data = $this.data('bs.popover')
|
||||
var options = typeof option == 'object' && option
|
||||
var selector = options && options.selector
|
||||
|
||||
if (!data && option == 'destroy') return
|
||||
if (!data) $this.data('bs.popover', (data = new Popover(this, options)))
|
||||
if (selector) {
|
||||
if (!data) $this.data('bs.popover', (data = {}))
|
||||
if (!data[selector]) data[selector] = new Popover(this, options)
|
||||
} else {
|
||||
if (!data) $this.data('bs.popover', (data = new Popover(this, options)))
|
||||
}
|
||||
if (typeof option == 'string') data[option]()
|
||||
})
|
||||
}
|
||||
|
|
|
@ -173,4 +173,48 @@ $(function () {
|
|||
ok(!$._data($popover[0], 'events').mouseover && !$._data($popover[0], 'events').mouseout, 'popover does not have any events')
|
||||
})
|
||||
|
||||
test('should render popover element using delegated selector', function () {
|
||||
var $div = $('<div><a href="#" title="mdo" data-content="http://twitter.com/mdo">@mdo</a></div>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.bootstrapPopover({
|
||||
selector: 'a',
|
||||
trigger: 'click'
|
||||
})
|
||||
|
||||
$div.find('a').click()
|
||||
notEqual($('.popover').length, 0, 'popover was inserted')
|
||||
|
||||
$div.find('a').click()
|
||||
equal($('.popover').length, 0, 'popover was removed')
|
||||
})
|
||||
|
||||
test('should render popover elements using different delegated selectors on the same node', function () {
|
||||
var popoverHTML = '<div>'
|
||||
+ '<a href="#" class="first" title="mdo" data-content="http://twitter.com/mdo">@mdo</a>'
|
||||
+ '<a href="#" class="second" title="mdo" data-content="http://twitter.com/mdo">@mdo</a>'
|
||||
+ '</div>'
|
||||
|
||||
var $div = $(popoverHTML)
|
||||
.appendTo('#qunit-fixture')
|
||||
.bootstrapPopover({
|
||||
selector: 'a.first',
|
||||
trigger: 'click'
|
||||
})
|
||||
.bootstrapPopover({
|
||||
selector: 'a.second',
|
||||
trigger: 'click'
|
||||
})
|
||||
|
||||
$div.find('a.first').click()
|
||||
notEqual($('.popover').length, 0, 'first popover was inserted')
|
||||
|
||||
$div.find('a.first').click()
|
||||
equal($('.popover').length, 0, 'first popover removed')
|
||||
|
||||
$div.find('a.second').click()
|
||||
notEqual($('.popover').length, 0, 'second popover was inserted')
|
||||
|
||||
$div.find('a.second').click()
|
||||
equal($('.popover').length, 0, 'second popover removed')
|
||||
})
|
||||
})
|
||||
|
|
|
@ -235,6 +235,37 @@ $(function () {
|
|||
equal($('.tooltip').length, 0, 'tooltip was removed from dom')
|
||||
})
|
||||
|
||||
test('should show tooltips with different delegate selectors on the same node on click', function () {
|
||||
var tooltipHTML = '<div>'
|
||||
+ '<a href="#" class="first" rel="tooltip" title="First delegated tooltip"/>'
|
||||
+ '<a href="#" class="second" rel="tooltip" title="Second delegated tooltip"/>'
|
||||
+ '</div>'
|
||||
|
||||
var $div = $(tooltipHTML)
|
||||
.append()
|
||||
.appendTo('#qunit-fixture')
|
||||
.bootstrapTooltip({
|
||||
selector: 'a.first[rel="tooltip"]',
|
||||
trigger: 'click'
|
||||
})
|
||||
.bootstrapTooltip({
|
||||
selector: 'a.second[rel="tooltip"]',
|
||||
trigger: 'click'
|
||||
})
|
||||
|
||||
$div.find('a.first').click()
|
||||
ok($('.tooltip').is('.fade.in'), 'first tooltip is faded in')
|
||||
|
||||
$div.find('a.first').click()
|
||||
equal($('.tooltip').length, 0, 'first tooltip was removed from dom')
|
||||
|
||||
$div.find('a.second').click()
|
||||
ok($('.tooltip').is('.fade.in'), 'second tooltip is faded in')
|
||||
|
||||
$div.find('a.second').click()
|
||||
equal($('.tooltip').length, 0, 'second tooltip was removed from dom')
|
||||
})
|
||||
|
||||
test('should show tooltip when toggle is called', function () {
|
||||
$('<a href="#" rel="tooltip" title="tooltip on toggle"/>')
|
||||
.appendTo('#qunit-fixture')
|
||||
|
|
|
@ -442,12 +442,18 @@
|
|||
|
||||
function Plugin(option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data('bs.tooltip')
|
||||
var options = typeof option == 'object' && option
|
||||
var $this = $(this)
|
||||
var data = $this.data('bs.tooltip')
|
||||
var options = typeof option == 'object' && option
|
||||
var selector = options && options.selector
|
||||
|
||||
if (!data && option == 'destroy') return
|
||||
if (!data) $this.data('bs.tooltip', (data = new Tooltip(this, options)))
|
||||
if (selector) {
|
||||
if (!data) $this.data('bs.tooltip', (data = {}))
|
||||
if (!data[selector]) data[selector] = new Tooltip(this, options)
|
||||
} else {
|
||||
if (!data) $this.data('bs.tooltip', (data = new Tooltip(this, options)))
|
||||
}
|
||||
if (typeof option == 'string') data[option]()
|
||||
})
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue