Bootstrap - Collega e mostra programmaticamente il popover a un elemento

Question

Sto utilizzando Bootstrap v3 e sto provando a mostrare un popover a livello di codice, accanto a un elemento, quando la pagina viene caricata. Nessun dominio di popover nel DOM. Voglio creare e mostrarlo in JQuery.

Ho provato questo ma non funziona.

$(document).ready(function() { 
    $('.theElement').popover({ 
      placement:'right', 
      trigger:'manual', 
      html:true, 
      content:'popover content' 
     }); 
    $('.theElement').popover('show') 
}); 

ottengo un "TypeError: Argomento 1 di Window.getComputedStyle non è un oggetto" errore nella console. Presumo che ciò sia causato da quanto sopra.

Answer 1

Prova questa

$(document).ready(function() { 
    $('.theElement').attr('data-placement','right') 
    //add all atributes..... 

    //and finally show the popover 
    $('.theElement').popover('show') 
}); 

Answer 2

$("[wf-popover]").popover({ 
     html : true, 
     content: function() { 
      var content = $(this).attr("wf-content"); 
      return content; 
     }, 
     title: function() { 
      var title = $(this).attr("wf-title"); 
      //return $(title).children(".popover-heading").html(); 
      return title; 
     }, 
     placement: function() { 
      var my = this.$element.attr('wf-popover') 
      return my; 
     }, 
     trigger: 'hover' 
    }); 

elemento

<img src="profile.jpg" wf-popover="left" wf-content="<img src='profile_big.jpg' width=500 height=500 />" data-original-title="" title="">