3

截图 - http://screencast.com/t/DxdVjiC7idUl

<div id="edit_form" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">?</button>
      <h3 id="myModalLabel">Редактирование объекта</h3>
    </div>
    <div class="modal-body" id="fm_edit_obj">
    </div>
    <div class="modal-footer">
      <button class="btn" data-dismiss="modal" aria-hidden="true">Отменить</button>
      <button class="btn btn-primary">Сохранить изменения</button>
    </div>
  </div>

点击图片——

$('#edit_form').modal({'show' : true});

为什么我看不到窗口,只有背景?

4

1 回答 1

2

使用 bootstrap 文档作为指南,假设您使用 bootstrap v3,您缺少“modal-dialog”和“modal-content”div。在这里,我使用您的代码进行了更改和测试:

  <div id="edit_form" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">?</button>
              <h3 id="myModalLabel">Редактирование объекта</h3>
            </div>
            <div class="modal-body" id="fm_edit_obj">
            BODY
            </div>
            <div class="modal-footer">
              <button class="btn" data-dismiss="modal" aria-hidden="true">Отменить</button>
              <button class="btn btn-primary">Сохранить изменения</button>
            </div>  
        </div>
    </div>
  </div>
  <img src="/img/knot.jpg" alt="" id="myimg">

<script>
$('#myimg').click(function(){
    $('#edit_form').modal('show');
});
</script> 
于 2013-10-27T01:06:55.817 回答