标签: popover

我使用如下代码:

$(".reply").popover({
  content: "Loading...",
  placement: "bottom"
});

$(".reply").popover("toggle");

这正确地创建了popover及其内容.我想在不关闭弹出窗口的情况下将新数据加载到弹出框中.

我尝试过以下方法:

var thisVal = $(this);
$.ajax({
  type: "POST",
  async: false,
  url: "Getdes",
  data: { id: ID }
}).success(function(data) {
  thisVal.attr("data-content", data);
});

在此调用之后,元素中的数据将被更改,但不会显示在显示的弹出框中.

我该怎么办？

我正在尝试为一个触发器定位一个twitter-bootstrap popover,该触发器位于960px宽网页的最右上角.理想情况下,我将它放在底部并用CSS移动箭头(因此箭头位于弹出窗口的右上角).

不幸的是,"放置":"底部"定位是不够的,因为它会将其置于触发器下方.

我正在寻找能够将弹出窗口静态放置在触发器左下方的解决方案.我读了很多问题,却找不到任何问题.

提示？

我使用bootstrap 3 popover.

现在我想链接文本popvover.

码:

<a href="#" 
  role="button" 
  class="btn popovers" 
  data-toggle="popover" 
  title="" 
  data-content="test content <a href="" title="test add link">link on content</a>" 
  data-original-title="test title"
  >
  test link
</a>

但是当我在html中启动代码时,我看到:

<a href="#" role="button" class="btn popovers" data-toggle="popover" title="" data-content="test content &lt;a href=" "="">link on content</a>
" 
data-original-title="test title"
&gt;
test link

我知道符号中的问题,"但我不知道在链接中添加链接...

请告诉我,如何正确的代码？

PS:如果问题已经存在,请给我链接.

我有一个链接,使用Twitter Bootstrap Popover版本1.3.0来显示一些信息.此信息包含一个链接,但每次我将鼠标从链接移动到弹出窗口时,弹出窗口就会消失.

如何让弹出窗口打开足够长的时间以使鼠标移动到其中？然后当鼠标移出链接并弹出时,隐藏它？

或者是否有其他插件可以做到这一点？

Twitter Bootstrap的popover功能的典型示例是带有标题的类固醇的工具提示.

HTML:

<a href="#" id="blob" class="btn large primary" rel="popover" data-content="And here's some amazing content. It's very engaging. right?" data-original-title="A title">hover for popover</a>

JS:

<script>
$("#blob").popover({offset: 10});
</script>

我想使用popover来显示图像.这可能吗？

我有弹出窗口的问题.如果我点击一个单元格,我将加载一个弹出框以选择更多细节.一切正常,但当我再次按下我的手机时,我每次都收到以下信息:

警告:尝试在MainTableViewController上呈现ModalTableViewController ...已经呈现(null)

如果我点击另一个单元格,我将不会收到此警告.仅当再次点击同一行时.

我尝试了很多东西,但我无法解决这个问题.我像这样加载我的popover:

var popover: UIPopoverController!
var popoverContent: ModalTableViewController!

在我的手机上点击:

popoverContent = self.storyboard.instantiateViewControllerWithIdentifier("ModalTableViewController") as ModalTableViewController

popoverContent.selectedQuestionID = indexPath!.row               
popover = UIPopoverController(contentViewController: popoverContent)
popover.delegate = self

popover.presentPopoverFromRect(currentCell.LabelCellTitle.frame, inView: currentCell.LabelCellTitle.superview, permittedArrowDirections: UIPopoverArrowDirection.Left, animated: true)

并解雇

func popoverControllerDidDismissPopover(popoverController: UIPopoverController!) {

    popover.dismissPopoverAnimated(false) // just to check

    self.popover = nil
    self.popoverContent = nil

}

有任何想法吗？

编辑:

如果我检查:

if(self.popoverContent == nil) {

在打开它之前,我会发现当我再次敲击同一个细胞时它不是零.

再次编辑:

如果我使用一些不同的设置创建它,我会遇到同样的问题:

自定义1x1px按钮.用popue连接popover.在单元格点击移动按钮到单元格并打开弹出窗口.

所以没有用于打开popover的代码,只有storyboard编辑器.

我得到相同的错误消息(有时),如果我再次点击相同的弹出窗口.

我使用如下的html代码来显示引导程序弹出窗口

<a data-original-title="" data-content="Hi,
           Welcome !

           Sincerely,
             programmer
           "
   data-placement="bottom">
    content
</a>

我按如下方式初始化了popover

$(this).popover({
            html:true
        });

一切正常,但问题是数据内容中可用的内容没有显示空格....它删除所有新行并在单行显示....我怎样才能克服这个....

我在动态列表中使用Twitter Bootstrap的popover.列表项有一个按钮,当我单击按钮时,它应该显示弹出窗口.当我在非动态测试时,它工作正常.

这是我的非动态列表的JavaScript

$("button[rel=popover]").popover({ 
    placement : 'right',
    container : 'body',
    html : true,
    //content:" <div style='color:red'>This is your div content</div>"
    content: function() {
      return $('#popover-content').html();
    }

    })
    .click(function(e) {
        e.preventDefault();
});

但是,它在动态列表上不能很好地工作.当我单击"两次"按钮时它会显示出来,并且只显示一个列表项我点击一次.

我的HTML:

 <ul id="project-list" class="nav nav-list">
   <li class='project-name'>
     <a >project name 1
         <button class="pop-function" rel="popover" ></button>
     </a>
   </li>
   <li class='project-name'>
     <a>project name 2
        <button class="pop-function" rel="popover" ></button>
     </a>
   </li>

 </ul>

<div id="popover-content" style="display:none">
    <button class="pop-sync"></button>
    <button class="pop-delete"></button>
</div>

我的动态JavaScript:

$(document).on("click", "#project-list li" , function(){
   var username = $.cookie("username");
   var …

我想在Bootstrap中将自定义CSS应用于popover的标题和内容,但是,似乎我的CSS被忽略了.

如何将特定CSS分别应用于标题和内容？

$("#poplink").popover({
    html: true,
    placement: "right",
    trigger: "hover",
    title: function () {
        return $(".pop-title").html();
    },
    content: function () {
        return $(".pop-content").html();
    }
});

html, body {
    width: 100%;
    height: 100%;
}
.pop-div {
    font-size: 13px;
    margin-top: 100px;
}
.pop-title {
    display: none;
    color: blue;
    font-size: 15px;
}
.pop-content {
    display: none;
    color: red;
    font-size: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="pop-div">
    <a id="poplink" href="javascript:void(0);">Pop</a>
    <div class="pop-title">Title here</div>
    <div class="pop-content">Content here</div>
</div>

例如:http://jsfiddle.net/Mx4Ez/

我试图使用bootstrap 3改变twitter bootstrap popover的宽度:

<button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">

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

目前,弹出窗口中的内容分布在两行上.我希望popover内容保持在一行.这可能吗？

我正在使用C#,html和css.