Загрузчик popover - настраиваемые поля
boottrap popover позволяет изменить html-шаблон, используемый в popover. я хочу изменить оригинальный шаблон:
<div class="popover" role="tooltip">
<div class="arrow"></div>
<h3 class="popover-title"></h3>
<div class="popover-content"></div>
</div>
что-то вроде этого:
<div class="popover" role="tooltip">
<div class="arrow"></div>
<h3 class="popover-title"></h3>
<div class="popover-content"></div>
<div class="popover-footer"></div>
</div>
таким образом, что я могу явно передать текст нижнего колонтитула в моих опциях в javascript:
options = {
title: "my title",
content: "my content",
footer: "my footer"
}
$(".popoverElement").popover(options);
причина, по которой я хочу сделать что-то вроде этого, заключается в том, что я хотел бы иметь возможность создавать кучу разных всплывающих окон, при этом только одна часть (например, нижний колонтитул) меняется между отдельными поповерами. но бутстрап не дает такой возможности. Вы знаете обходной путь, который я мог бы использовать?
1 ответ
Да, он предоставляет способ настройки шаблона popover, с template
вариант.
$(document).ready(function () {
var popoverTemplate = ['<div class="timePickerWrapper popover">',
'<div class="arrow"></div>',
'<div class="popover-content">',
'</div>',
'</div>'].join('');
var content = ['<div class="timePickerCanvas">asfaf asfsadf</div>',
'<div class="timePickerClock timePickerHours">asdf asdfasf</div>',
'<div class="timePickerClock timePickerMinutes"> asfa </div>', ].join('');
$('body').popover({
selector: '[rel=popover]',
trigger: 'click',
content: content,
template: popoverTemplate,
placement: "bottom",
html: true
});
});
Проверьте это /questions/32111654/zastavte-zagruzchik-rabotat-s-polzovatelskim-shablonom-html/32111676#32111676