Question

我的引导程序弹出窗口没有显示出来。

这是我的HTML：

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

<div align='left' id='person'>Person</div>

<div id="popoverEditPerson" class="hide">
    <form>
        <h4>Enter Name:</h4>
        <input id='nameInput' type='text' placeholder='Name'/>
    </form>
</div>

这是我的JavaScript：

$(function(){
    $('#person').popover({
        html: true,
        title: 'Edit Person<a class="close" href="#");">&times;</a>',
        content: $('#popoverEditPerson').html(),
        placement: 'auto'
    });
});

有没有人知道我可能做错了什么？

Answer 1

我要做的是设置班级=＆＃39;隐藏＆＃39;不是在popoverEditPerson div本身，而是在它周围：

<div class="hide">
  <div id="popoverEditPerson">
      <form>
          <h4>Enter Name:</h4>
          <input id='nameInput' type='text' placeholder='Name'/>
      </form>
  </div>

https://jsfiddle.net/ue1kss3v/1/

如果我点击该人，则按预期工作

Bootstrap Popover不起作用

1 个答案: