Question

我想在我的页面上打开一个外部模态框，我使用bootstrap

主HTML1（index.html）

<button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-remote="modal.html" >Assumir Tarefa</button>

模态HTML（modal.html）

<div class="modal fade" id="myModal" 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-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
       ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

Answer 1

看起来你混淆了一个模态是如何工作的。您将模态代码放在一个单独的html文件中并尝试调用它。

将通话按钮更改为：

<button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-remote="#myModal" >Assumir Tarefa</button>

将您从modal.html粘贴的代码放在同一个文件index.html中（以及所有其他引导程序所需的文件）。如果您不确定自己还需要什么，请查看Bootstrap Getting Started

使用Bootstrap打开外部Modal Box

1 个答案: