самозагрузки поповера с содержанием HTML

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

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>Bootstrap Example</title> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> 
</head> 
<body> 

    <div class="container"> 
    <h3>Popover Example</h3> 
    <p>Popovers are not CSS-only plugins, and must therefore be initialized with jQuery: select the specified element and call the popover() method.</p> 
    <div class="popover" > 
     <a href="#" class="popover-toggle" title="Popover Header" >Toggle popover</a> 
     <div class="popover-content"> 
      Here I am 
     </div> 
    </div> 
    </div> 

<script> 
    $(document).ready(function(){ 
    $('[data-toggle="popover"]').popover(); 
    }); 
</script> 

</body> 
</html>

источник

2015-06-05 Mitch VanDuyn

You имеют простой якорь и некоторые div, которые не должны отображаться.

<a href="#" id="tglr" class="popover-toggle" title="Popover Header">Toggle popover</a> 
<div id="customdiv" style="display: none"> 
    Here <b>I</b> am 
</div>

В JS мы получаем наш якорь (по идентификатору) и установить поповер на нем с 2-х вариантов: первый «HTML» - позволяет отображать HTML вместо простого текста, второй определяет содержание, которое получило от нашего DIV:

$(document).ready(function(){ 
    $('#tglr').popover({ 
     html : true, 
     content: function() { 
      return $('#customdiv').html(); 
     } 
    }); 
});

Вот ваш пример https://jsfiddle.net/DTcHh/8529/

Одним из вопросов вашего кода - вы выполняете $ («[данных тумблер =„поповер“]»), который будет выбирать метки с данными-тумблер, который равен на «popover»), но у вас нет таких тегов. Если вы хотите инициализировать Popovers таким образом, вы должны объявить якорь, как это:

<a href="#" data-toggle="popover" class="popover-toggle" title="Popover Header">Toggle popover</a>

Но в вашем случае у вас есть только одна связь с одной пользовательской пирог, так что более логично выбрать его идентификатор.

источник

2015-06-05 23:11:05 user3479125

Извините за любые опечатки, но я хочу сказать, что с другими компонентами начальной загрузки (например, выпадающим меню) вы можете указать контент отдельно от кнопки, обернув оба элемента в div. Думаю, это не работает с pop pop ???? –

Я понимаю, чего вы хотите, но я не понимаю, почему вы хотите его обернуть? Какие преимущества такого способа? Вы просто хотите достичь единообразия и понять логику бутстрапа? Что касается меня на практике, это неудобно. Во многих случаях достаточно даже простого атрибута data-content вместо div. – user3479125

спасибо за понимание! Причина частично да для понимания, но главным образом потому, что мы интегрируем Ruby с React с помощью Opal. Реакция не нравится, когда части DOM вставляются в строку, подобную этой. Это можно сделать, но это делает реакцию менее эффективной. –

самозагрузки поповера с содержанием HTML

ответ

Смежные вопросы