無法通過jQuery設置Bootstrap Popover選項

Bootstrap專家：無法通過jQuery設置Bootstrap Popover選項

我只是無法通過jQuery設置popover標題和內容！我一直在看幾個小時的所有其他相關問題 - 沒有骰子。請告訴我我錯過了什麼！

HTML：

<body class="homepage"> 
    <p><a id="pop1" data-toggle="popover" class="btn my_popover" href="#" data-container="body" data-html="true" rel="popover" data-trigger="hover" >Popover 1</a> </p> 

<p><a id="pop2" data-toggle="popover" class="btn my_popover" href="#" data-container="body" data-html="true" rel="popover" data-trigger="hover" >Popover 2</a> </p> 

</body>

的Javascript（我在前面初始化popovers這就是我要設置標題和內容）

function my_popover_handler() { 
    var fcont_html=""; 
    var ftitle_html=""; 
    var fid=""; 
    $('body').on('mouseenter','.my_popover',function(event) { 
    event.preventDefault(); 
    fid =$(this).attr('id'); 
    if (fid=="pop1"){ 
     //Doesn't work 
     fcont_html="This is Pop1 content";  
     ftitle_html="Pop1 title bar"; 
     $('#pop1').popover({title:ftitle_html,content:fcont_html}); 
     $("#pop1").popover('show'); 
    } else if (fid=="pop2"){ 
     //This works 
     fcont_html="This is Pop2 content";  
     ftitle_html="Pop2 title bar"; 
     $('#pop2').attr('data-original-title', ftitle_html); 
     $('#pop2').attr('data-content', fcont_html); 
     $("#pop2").popover('show'); 
    } 
}).on(' mouseleave','.fm_feat_popover',function(event) { 
    event.preventDefault(); 
    $("[data-toggle=popover]").popover('hide'); 
}); 
}

對於第一個按鈕，POP1，我用什麼引導文件說

$('#pop1').popover({title:ftitle_html,content:fcont_html});

哪個不起作用。第二個，pop2，

$('#pop2').attr('data-original-title', ftitle_html); 
$('#pop2').attr('data-content', fcont_html);

它的工作原理。

我的錯誤是什麼？謝謝！

Mmiz

來源

2016-12-16 user1072910

http://jsfiddle.net/arunpjohny/49okx20v/1/？ –

@ArunPJohny - 你改變任何東西來讓它起作用嗎？ – user1072910

@ user1072910檢查以下答案是否適合您 – ScanQR

第一個選項沒有工作，因爲你缺少相關data-original-title屬性。

即

<a id="pop1" data-toggle="popover" class="btn my_popover" href="#" data-container="body" data-html="true" rel="popover" data-trigger="hover" >Popover 1</a>

而是添加相關的屬性和嘗試，

<a id="pop1" data-toggle="popover" data-original-title="Dummy Title" class="btn my_popover" href="#" data-container="body" data-html="true" rel="popover" data-trigger="hover" >Popover 1</a>

來源

2016-12-16 08:33:38 ScanQR

無法通過jQuery設置Bootstrap Popover選項

回答

相關問題