Boostrap模态框通过url加载内容

  Boostrap模态框可能通过jquery.load方法加载内容。

1、通过<a>标签加载

<a data-toggle="modal" href="{url}" data-target="#modal" rel="noopener noreferrer">请点击我</a>

2、通过button加载

<button type='button' data-remote='{url}' data-toggle='modal' data-target='#showModal'>点击加载</button>

data-toggle:打开模态窗口

data-target:模态窗口id

data-remote:填充窗口的url

3、被打开的模态窗口定义如下

<div class="modal fade" id="showModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

注意，<div class="modal-content">就是被填充的位置，被填充的内容就包含

<div class="modal-header">

<div class="modal-body">

<div class="modal-body">

三个结构