使用引导和jquery更改popover的标题

以下是链接的html，即：

 <a href="javascript:void(0);" style="font-size: 3em; color: #222" class="popover-test" id="directNavPrev" data-title="Previous Result Row" data-content="Previous Result Row">
&laquo;</a>

是的，我正在调用.popover（）进行初始化，popover工作正常。我可以让内容更新没有问题。只是不是标题。我尝试过“prev.data（'title'，'newtitle'）”，甚至尝试过重新初始化“prev.popover（{title:'newtitle'}）”；“没有骰子。。。谢谢

 function SetDirectNavigationPlaceholder() {
    //debugger;
    var item = $("#movementType :selected").val();
    var direct = $('#directNavigation');
    var prev = $('#directNavPrev');
    var next = $('#directNavNext');
    switch (item) {
        case "result":
            $('#bookTypeSection').addClass('hide');
            direct.val('Result Row from 1 - 150');
            prev.attr('data-title', "Previous Result Row");
            next.attr('data-title', "Next Result Row");
            prev.attr('data-content', "Check it! this will contain the information for the previous result<table><tr><td>blah</td><td>blah</td></tr><tr><td>blah</td><td>blah</td></tr><tr><td>blah</td><td>blah</td></tr><tr><td>blah</td><td>blah</td></tr></table>");
            next.attr('data-content', "Check it! this will contain the information for the next result<table><tr><td>blah</td><td>blah</td></tr></table>");
            break;
        case "instrument":
            $('#bookTypeSection').addClass('hide');
            direct.val('Instrument #');
            prev.attr('data-title', "Previous Instrument #");
            next.attr('data-title', "Next Instrument #");
            prev.attr('data-content', "Check it! this will contain the information for the previous <b>instrument</b><table><tr><td>blah</td><td>blah</td></tr></table>");
            next.attr('data-content', "Check it! this will contain the information for the next <b>instrument</b><table><tr><td>blah</td><td>blah</td></tr></table>");
            break;
        case "bookpage":
            $('#bookTypeSection').removeClass('hide');
            direct.val('Book/Page');
            prev.attr('data-title', "Previous Book/Page");
            next.attr('data-title', "Next Book/Page");
            prev.attr('data-content', "Check it! this will contain the information for the previous <b>book/page</b><table><tr><td>blah</td><td>blah</td></tr></table>");
            next.attr('data-content', "Check it! this will contain the information for the next <b>book/page</b><table><tr><td>blah</td><td>blah</td></tr></table>");
            break;
    }
    direct.css('color', '#aaa').not('#directNavigationHeader');
}

函数SetDirectNavigationPlaceholder（）{
//调试器；
var item=$（“#movementType:selected”）.val（）；
var direct=$（“#directNavigation”）；
var-prev=$（'directNavPrev'）；
var next=$（'directNavNext'）；
开关（项目）{
案例“结果”：
$（'#bookTypeSection'）.addClass（'hide'）；
direct.val（'1-150'的结果行）；
上一个属性（“数据标题”，“上一个结果行”）；
attr（'data-title'，“下一个结果行”）；
prev.attr（'data-content'，“检查它！这将包含先前结果的信息blahblahblahblahblahblahblahblahblahblahblahblah”）；
attr（'data-content'，“Check it！这将包含下一个resultblahblah的信息”）；
打破
案例“文书”：
$（'#bookTypeSection'）.addClass（'hide'）；
direct.val（'Instrument#'）；
上一个属性（“数据标题”，“上一份文书”）；
next.attr（'data-title'，“next Instrument#”）；
prev.attr（'data-content'，“检查它！这将包含上一个instrumentblahblah的信息”）；
attr（'data-content'，“Check it！这将包含下一个instrumentblahblah的信息”）；
打破
案例“书页”：
$（“#bookTypeSection”）.removeClass（'hide'）；
direct.val（“书/页”）；
上一页属性（“数据标题”，“以前的书/页”）；
next.attr（“数据标题”，“下一本书/页”）；
prev.attr（'data-content'，“Check it！这将包含上一本书的信息/pageblahblah”）；
attr（'data-content'，“Check it！这将包含下一本书的信息/pageblahblah”）；
打破
}
css（'color'，'aaa'）。而不是（'directNavigationHeader'）；
}

看起来Twitter bootstrap没有为popover保留一个

div

，因此不可能通过更改标题来更改标题。不过，这可能会有所帮助

你可以，呃，摆弄它

以及那些不能摆弄它的人的代码。：-）

HTML:

---

想想那只被剥皮的猫

事情是这样的。在bootstrap.js文件中，似乎没有getTitle（）的方法，即使它正在调用。所以我加了它。享受

/* NOTE: POPOVER EXTENDS BOOTSTRAP-TOOLTIP.js
 ========================================== */

Popover.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype, {
  constructor: Popover, setContent: function () {
  //debugger;

  var $tip = this.tip()
    , title = this.getTitle() // didn't exist
    , content = this.getContent()

  $tip.find('.popover-title')[this.isHTML(title) ? 'html' : 'text'](title)
  $tip.find('.popover-content > *')[this.isHTML(content) ? 'html' : 'text'](content)

  $tip.removeClass('fade top bottom left right in')
}

, hasContent: function () {
  return this.getTitle() || this.getContent()
}

 , getContent: function () {
  var content
    , $e = this.$element
    , o = this.options

  content = $e.attr('data-content')
    || (typeof o.content == 'function' ? o.content.call($e[0]) : o.content)

  return content
}

 , getTitle: function () { // does now
  var title
    , $t = this.$element
    , n = this.options

  title = $t.attr('data-title')
    || (typeof n.title == 'function' ? n.title.call($t[0]) : n.title)

  return title
}

, tip: function () {
  if (!this.$tip) {
      this.$tip = $(this.options.template)
  }
  return this.$tip
}

})

---

由于某些原因，我无法获取实际的“title”属性，因此如果要更改它，您必须使用“data title”。

最简单的方法是：

     var newTitle = "Here's my new title";
     $('#MyExample').attr('data-original-title', newTitle);

希望有帮助

这对我有用

$("#mylink").data()["bs.popover"].config.title = "New Ttile";
$("#mylink").data()["bs.popover"].config.content = "<p>New Content</p>";

$（“#mylink”）.data（）[“bs.popover”].config.title=“New Ttile”；
$（“#mylink”）.data（）[“bs.popover”].config.content=“新内容”
”；

或

$（“#mylink”）.data（“bs.popover”）.config.title=“New Ttile”；
$（“#mylink”）.data（“bs.popover”）.config.content=“新内容”
”；

那是脏的。你知道我喜欢什么。事实上，这不是一个解决办法。太棒了！我将修改JS并继续。谢谢。popover的

getTitle

方法继承自

工具提示

构造函数。因此，有一个

getTitle

方法是您要重写的。我一直在寻找的那个讨厌的小片段，已经有一段时间了，谢谢Yann，我的朋友！！非常感谢！我自己发现的，因为我注意到没有人在谈论它为什么Bootstrap不提供这方面的文档，或者其他一些基本特性？例如，为什么在显示popover元素时没有API命令来获取它？对我来说是有效的，设置“数据标题”时它不起作用，所以我很高兴找到了这个答案

     var newTitle = "Here's my new title";
     $('#MyExample').attr('data-original-title', newTitle);

$("#mylink").data()["bs.popover"].config.title = "New Ttile";
$("#mylink").data()["bs.popover"].config.content = "<p>New Content</p>";

$("#mylink").data("bs.popover").config.title = "New Ttile";
$("#mylink").data("bs.popover").config.content = "<p>New Content</p>";