我已經使用一些引導程式元素為我的按鈕設定了一些屬性,但是當我第一次單擊該按鈕時它不起作用。我需要單擊按鈕外的某處,然后再次單擊該按鈕。
我已經通過在 onl oad 中呼叫該函式并在按鈕中再次呼叫它來解決這個問題,但現在我處于無法再這樣做的情況,所以我想知道還有其他方法可以解決這個問題嗎?
這是我的代碼:https : //jsfiddle.net/a22177861/x381z0h6/6/
HTML:
<button type="button" class="btn btn-warning" onclick="PopOver(this,'Hi','Thank','You');">ClickMe!</button>
JS:
function PopOver(myObj, mgr, Adate, Vdate) {
$(function () {
myObj.setAttribute("data-container", "body");
myObj.setAttribute("data-toggle", "popover");
myObj.setAttribute("data-placement", "bottom");
myObj.setAttribute("data-html", "true");
myObj.setAttribute("data-trigger", "focus");
myObj.setAttribute("title", "otherInfo");
myObj.setAttribute('data-content', "MGR:" mgr "<br />DATE1:" Adate "<br />DATE2:" Vdate);
$("[data-toggle='popover']").popover();
});
}
任何幫助將不勝感激!
uj5u.com熱心網友回復:
這$('[data-toggle="popover"]').popover()在您的代碼中只是初始化彈出視窗,因此您必須單擊兩次才能觸發它。
根據 Boostrap Popovers
顯示元素的彈出框。在實際顯示彈出視窗之前(即在顯示.bs.popover 事件發生之前)回傳給呼叫者。這被認為是彈出視窗的“手動”觸發。標題和內容都為零長度的彈出框永遠不會顯示。
您可以使用.popover('show')手動觸發彈出框。
它會是這樣的:
function PopOver(myObj, mgr, Adate, Vdate) {
myObj.setAttribute("data-container", "body");
myObj.setAttribute("data-toggle", "popover");
myObj.setAttribute("data-placement", "bottom");
myObj.setAttribute("data-html", "true");
myObj.setAttribute("data-trigger", "focus");
myObj.setAttribute("title", "otherInfo");
myObj.setAttribute('data-content', "MGR:" mgr "<br />DATE1:" Adate "<br />DATE2:" Vdate);
$("[data-toggle='popover']").popover('show');
}
uj5u.com熱心網友回復:
我建議您以更友好的方式撰寫代碼。一些死欄位可以直接用HTML撰寫
<button type="button" class="btn btn-warning" data-container="body" data-toggle="popover" data-trigger="focus" data-placement="bottom" data-html="true" title='otherInfo' onclick="PopOver(this,'Hi','Thank','You');">ClickMe!</button>
function PopOver(myObj, mgr, Adate, Vdate) {
myObj.setAttribute('data-content', "MGR:" mgr "<br />DATE1:" Adate "<br />DATE2:" Vdate);
$("[data-toggle='popover']").popover('show');
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/358315.html
