Как обновить загрузочный текст?

Ответ 1

Hiya, пожалуйста, посмотрите демо здесь: http://jsfiddle.net/4g3Py/1/

Я внес изменения, чтобы получить желаемый результат.:)

Я считаю, что вы уже знаете, что делаете, но некоторые примеры из моего конца следуют ниже: http://dl.dropbox.com/u/74874/test_scripts/popover/index.html# - поделитесь этой ссылкой, чтобы дать вам представление о том, другая ссылка с разным pop-over, если вы увидите атрибут уведомления источника data-content, но то, что вы хотели, работает с помощью следующих изменений.

Имейте хороший и надейтесь, что это поможет. Не забывайте голосовать и принимать ответ:)

Код JQuery

var i = 0;
$('a#test').click(function() {
    i += 1;

    $('a#test').popover({
        trigger: 'manual',
        placement: 'right',
        content: function() {
           var message = "Count is" + i;
             return message;
        }
    });
    $('a#test').popover("show");

});​

HTML

<a id="test">Click me</a>
​

Ответ 2

Вы можете получить доступ к параметрам напрямую, используя словарь закрытия данных jquery, например:

$('a#test').data('bs.popover').options.content = 'new content';

Этот код должен работать нормально даже после первой инициализации popover.

Ответ 3

в любом случае, кто ищет решение, которое не требует повторного создания popover и просто хочет изменить содержимое html, посмотрите на это:

$('a#test').data('popover').$tip.find(".popover-content").html("<div>some new content yo</div>")

Обновление:. В какой-то момент между этим ответом и Bootstrap 3.2.0 (я подозреваю, что в 3.0?) это немного изменилось, чтобы:

$('a#test').data('bs.popover').tip().find ............

Ответ 4

Старый вопрос, но поскольку я замечаю, что ответ не отвечает правильно, и это общий вопрос, я бы хотел его обновить.

Используйте метод $("a#test").popover("destroy");. Здесь скрипта.

Это уничтожит старый popover и позволит вам снова подключить новый.

Здесь приведен пример, в котором вы можете нажать кнопку, чтобы установить новый popover на объект, к которому уже добавлено popover. Подробнее см. Скрипку.

$("button.setNewPopoverContent").on("click", function(e) {
    e.preventDefault();

    $(".popoverObject").popover("destroy").popover({
        title: "New title"
        content: "New content"
    );
});

Ответ 5

Вопрос уже не один год, но, возможно, это будет полезно для других.

Если содержимое изменяется только во время скрытия, самый простой способ - это использовать функцию и немного JS-кода.

В частности, мой HTML выглядит так:

<input id="test" data-toggle="popover"
       data-placement="bottom" data-trigger="focus" />
<div id="popover-content" style="display: none">
  <!-- Hidden div with the popover content -->
  <p>This is the popover content</p>
</div>

Обратите внимание, что содержимое данных не указано. В JS, когда создается popover, для содержимого используется функция:

$('test').popover({
    html: true,
    content: function() { return $('#popover-content').html(); }
});

И теперь вы можете изменить в любом месте div-popover-content, а popover будет обновляться в следующий раз:

$('#popover-content').html("<p>New content</p>");

Я предполагаю, что эта идея также будет работать с использованием обычного текста вместо HTML.

Ответ 6

Вы всегда можете напрямую изменить DOM:

$('a#test').next(".popover").find(".popover-content").html("Content");

Например, если вы хотите, чтобы popover загружал некоторые данные из API и отображал это в popover content при наведении:

    $("#myPopover").popover({
        trigger: 'hover'
    }).on('shown.bs.popover', function () {
        var popover = $(this);
        var contentEl = popover.next(".popover").find(".popover-content");
        // Show spinner while waiting for data to be fetched
        contentEl.html("<i class='fa fa-spinner fa-pulse fa-2x fa-fw'></i>");

        var myParameter = popover.data('api-parameter');
        $.getJSON("http://ipinfo.io/" + myParameter)
        .done(function (data) {
          var result = '';
          if (data.org) {
            result += data.org + '<br>';
          }
          if (data.city) {
            result += data.city + ', ';
          }

          if (data.region) {
            result += data.region + ' ';
          }
          if (data.country) {
            result += data.country;
          }
          if (result == '') {
            result = "No info found.";
          }
          contentEl.html(result);
        }).fail(function (data) {
          result = "No info found.";
          contentEl.html(result);
        });
    });

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<a href="#" id="myPopover" data-toggle="popover" data-title="IP Details" data-api-parameter="151.101.1.69">Hover here for details on IP 151.101.1.69</a>

Ответ 7

Я обнаружил, что динамический контент Bootstrap popover не может изменяться, который вводит функцию setContent. Поэтому мой код (надеюсь, полезный для кого-то):

(Отмечая, что данные jquery() не так хороши при настройке, поскольку они получают)

// Update basket
current = $('#basketPopover').data('content');
newbasket = current.replace(/\d+/i,parseInt(data));

$('#basketPopover').attr('data-content',newbasket);
$('#basketPopover').setContent();
$('#basketPopover').$tip.addClass(popover.options.placement);