321 votes

HTML à l’intérieur de Twitter Bootstrap kangourou

J’essaie d’afficher le code html à l’intérieur d’un kangourou bootstrap. mais en quelque sorte, ce n’est ne pas travailler. J’ai trouvé quelques réponses ici mais ça ne marchera pas pour moi. s’il vous plaît laissez-moi savoir si im faire quelque chose de mal.

Merci beaucoup

376voto

Mauno V. Points 3868

Vous ne pouvez pas utiliser <li href="#" car il appartient <a href="#" c'est pourquoi il ne fonctionnait pas, le changer et c'est du tout bon.

J'ai créé exemple de liste de violon qui vous montre cela, j'espère que ça aide! voir tripoter! :)

Edit:

Créée mieux de jouer avec des explications: peut être vu de mieux violon exemple

Reliant également les parties pertinentes du code ici:

HTML:

  <!-- Popover Example 1 - HTML -->
  <!-- Popover using HTML to set content and title --> 

  <!-- Still requires at least $("[data-toggle=popover]").popover(); to enabled it via JavaScript! -->
  <!-- Alternatively, you can use id="myPopover" or class="myPopover" no need to use data-toggle tag (!) -->
  <!-- Just remember to change JavaScript to e.g., $("#myPopover").popover(); in those cases, see example 2 -->
  <a href="#" 
    data-toggle="popover" 
    data-html="true" 
    data-content="<div><b>Popover Example</b> 1 - Content</div>"
    title="Popover Example <b>1</b> - Title">Popover Example 1</a>

  <br /><br />

  <!-- Popover Example 2 - JS -->
  <!-- Popover using JavaScript to set content from hidden div --> 
  <a href="#" id="popoverExampleTwo">Popover Example 2</a>

  <!-- Popover 2 hidden content -->
  <div id="popoverExampleTwoHiddenContent" style="display: none">
     <div><b>Popover Example</b> 2 - Content</div>
  </div>  
  <!-- Popover 2 hidden title -->
  <div id="popoverExampleTwoHiddenTitle" style="display: none">
     Popover Example <b>2</b> - Title
  </div> 

JavaScript:

$(function(){

    // Enabling Popover Example 1 - HTML (content and title from html tags of element)
    $("[data-toggle=popover]").popover();

    // Enabling Popover Example 2 - JS (hidden content and title capturing)
    $("#popoverExampleTwo").popover({
        html : true, 
        content: function() {
          return $('#popoverExampleTwoHiddenContent').html();
        },
        title: function() {
          return $('#popoverExampleTwoHiddenTitle').html();
        }
    });

});

303voto

vous pouvez utiliser l’attribut `` :

123voto

Jack Points 124

Une autre façon de spécifier le contenu de kangourou de manière réutilisable est de créer un nouvel attribut de données comme `` et utilisez-le comme ceci :

HTML :

js :

Cela peut être utile lorsque vous avez beaucoup de code html à placer dans votre popovers.

Voici un fiddle exemple : http://jsfiddle.net/z824fn6b/

88voto

Mike Lucid Points 465

Vous devez créer une instance de kangourou qui a l’option html activée (Placez ceci dans votre fichier javascript après le code JS kangourou) :

``

25voto

user3319310 Points 51

J’ai utilisé un pop plus à l’intérieur d’une liste, Im donnant un exemple via HTML

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X