如何通过单击弹出窗口内的按钮来关闭Bootstrap弹出窗口

不幸的是，我正努力在单击窗体html按钮时弹出Bootstrap弹出窗口（该窗口在我的页面上打开特定位置）本身）。我知道有类似的问题，并相信我我已经尝试了一些相关的解决方案无济于事...如何通过单击弹出窗口内的按钮来关闭Bootstrap弹出窗口

我有以下Javascript代码用于在特定元素的页面上打开引导程序弹窗：

setTimeout(function(){$('#bob').popover({ 

    title:"Reaction", 
    html:true, 
    content:html 

}).popover('show')}, 1000); 

// If a popover is open then can execute the following Javascript. Need to detect also which step clicked on... 
$('#bob').on('shown.bs.popover', function() {    

    var close = document.getElementById("yes"); 

    // if close button is clicked... 
    close.addEventListener("click", function(){ 

     event.preventDefault(); 

     console.log("close button clicked");   

     $('#bob').popover('hide'); 

    }): 

});

为酥料饼中的按钮相关的HTML如下：

<button id ="yes" data-toggle="clickover" class = "btn btn-small btn-primary pull-right">Yes</button>

不幸的是，上述方法无效。

我也看了其他的答案/对于这个问题的解决方案，并已经尝试以下无济于事：

<button id ="yes" data-toggle="clickover" class = "btn btn-small btn-primary pull-right" onclick="event.preventDefault(); $(&quot;id&quot;).popover(&quot;hide&quot;);">Yes</button>

我将不胜感激，如果有人可以给我一些线索/提示如何我可以得到这个工作。

亲切的问候

来源

2016-07-30 Mathias

代码本身有错误。您忘记在ID选择器之前添加＃＃

//如果弹出窗口打开，则可以执行以下Javascript。也需要哪一步点击，检测...

$("#"+id).on('shown.bs.popover', function() {    

    var close = document.getElementById("yes"); 

    // if close button is clicked... 
    close.addEventListener("click", function(){ 

     event.preventDefault(); 

     console.log("close button clicked");   


     $("#"+id).popover('hide'); 

    }): 

});

来源

2016-07-30 17:49:16

你怎么知道“id”变量包含什么？你假设它只是一个数字，但它可以是“#number”形式的字符串。 – lector

好的，请参阅我所做的上述代码编辑。我将id更改为“#bob”，但仍然无效。我想知道你有没有进一步的建议？欢呼声 – Mathias

当然写“数字”我的意思是“标识符”。数据库太多时间:) – lector

第一件事 - 错误：

有一个冒号，而不是在从结束第三行的末尾分号，

这里

close.addEventListener("click", function(){ 

    event.preventDefault();

你忘了把'event'放在函数参数中。

而主要问题：您正尝试尽快指定事件处理程序'shown.bs.popover'。把它document.ready应该解决的问题

setTimeout(function(){$('#bob').popover({ 

    title:"Reaction", 
    html:true, 
    content:html 

}).popover('show')}, 1000); 

$(function(){//<---ADD THIS 
    // If a popover is open then can execute the following Javascript. Need to detect also which step clicked on... 
    $('#bob').on('shown.bs.popover', function() {    

     var close = document.getElementById("yes"); 

     // if close button is clicked... 
     close.addEventListener("click", function(event){ 

      event.preventDefault(); 

      console.log("close button clicked");   

      $('#bob').popover('hide'); 

     }); 

    }); 
});//<---ADD THIS

如果使用setTimeout出于同样的原因（没有它$('#bob').popover()不工作），通过它puttin到document.ready块太大改变。不要依靠setTimeout。

来源

2016-07-30 20:14:25 lector

如何通过单击弹出窗口内的按钮来关闭Bootstrap弹出窗口

回答

相关问题