Bootstrap自定义弹出窗口

Question

是否可以拥有自定义引导程序弹出窗口？

我的意思是我希望能够使用

$('#example').popover(options)

所以点击一个元素#example,我会传递一些文字(可以在可编辑的textarea中显示);

我正在使用bootstrap 2.3.2

Answer 1

我不认为评论中的链接完全回答了这个问题.这是一个2.3.2示例,使用多个链接/元素,text()从元素传递到弹出窗口上的textarea,然后返回到"提交"元素:

<a href="#" rel="comments" title="Enter comments">awesome user</a>

使用popovers template功能自定义popover (添加按钮),设置为<textarea>as content,将链接/元素的文本注入shown事件上的textarea :

$("[rel=comments]").popover({
    trigger : 'click',  
    placement : 'top', 
    html: 'true', 
    content : '<textarea class="popover-textarea"></textarea>',
    template: '<div class="popover"><div class="arrow"></div>'+
              '<h3 class="popover-title"></h3><div class="popover-content">'+
              '</div><div class="popover-footer"><button type="button" class="btn btn-primary popover-submit">'+
              '<i class="icon-ok icon-white"></i></button>&nbsp;'+
              '<button type="button" class="btn btn-default popover-cancel">'+
              '<i class="icon-remove"></i></button></div></div>' 
})
.on('shown', function() {
    //hide any visible comment-popover
    $("[rel=comments]").not(this).popover('hide');
    var $this = $(this);
    //attach link text
    $('.popover-textarea').val($this.text()).focus();
    //close on cancel
    $('.popover-cancel').click(function() {
        $this.popover('hide');
    });
    //update link text on submit
    $('.popover-submit').click(function() {
        $this.text($('.popover-textarea').val());
        $this.popover('hide');
    });
});

看到小提琴 - > http://jsfiddle.net/e4zMu/这里有三个可编辑的链接/元素: