Question

我试图做一个创建内容动态的popover，并希望选择与该选项进行交互。

我有一个select而我的option中的一个必须弹出一个popover，其中的表单包含＆＃39;接受＆＃39;和＆＃39;取消＆＃39; buttons。但首先，我的页面上没有显示，第二个（在w3schools编辑中尝试最后我可以显示弹出窗口），“取消”按钮并不隐藏当前的弹出窗口。

这是popover工作的JsFiddle但没有关闭（现在它只有一个console.log试图显示＆＃39;你好＆＃39;但是没有工作）

这是jsFiddle，因为在“没有声音”的情况下试图获得弹出窗口。被选中。

任何人都可以解释为什么我的任何尝试都不起作用？

Answer 1

在这里，您可以使用上半年的解决方案https://jsfiddle.net/c3yq1o43/3/。点击取消按钮

按按钮关闭关闭

$(document).ready(function(){

	 closepop = function(){
   	  $('[data-toggle="popover"]').popover('hide');
   }
        
    var pop = $('[data-toggle="popover"]').popover({
    html:true,
    content: function(){
    	return "<form name='statusForm'>"+
        			"<div class='form-group'>"+
                    	"<textarea class='form-control' name='estado' placeholder='Motivo de la no-disponibilidad' required></textarea>"+
                    "</div>"+
        			"<button class='button btn btn-success' type='button'>Aceptar</button>"+
                    "<button class='button btn btn-success' type='button' onclick='closepop()'>Cancelar</button>"+
                "</form>"
    }});  
    
    
    
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<body>
  <div class="container">
    <h3>Popover Example</h3>
    <p>Popovers are not CSS-only plugins, and must therefore be initialized with jQuery: select the specified element and call the popover() method.</p>
    <a href="#" data-toggle="popover" title="Popover Header">Toggle popover</a>
  </div>
</body>

我试图提出问题的后半部分。有点混乱..

在选择'No Disponible'选项时，您想要显示 popover ???

动态选择选项中的Bootstrap Popover

1 个答案: