bootstrap的模态框使用方法

使用方式一：使用绑定class方式进行弹出：

在一个起控制器作用的元素（例如：按钮）上添加 data-toggle=“modal” 属性，或者 data-target="#foo" 属性，再或者 href="#foo" target="_blank" rel="external nofollow" 属性，用于指向被控制的模态框。

使用方式二：使用js打开

方式如下(jquery,不是的可用

document.getElementById("MyButtonId"))

方法拿到，之后调用.modal(data)方法

$('#MyButtonId').modal({
          keyboard: true,
          show: true,
        })
           

modal中的data类的具体设置如下

名称	类型	默认值	描述
keyboard	boolean	true	键盘上的 esc 键被按下时关闭模态框。
show	boolean	true	模态框初始化之后就立即显示出来
backdrop	boolean 或 字符串 ‘static’	true	Includes a modal-backdrop element. Alternatively, specify static for a backdrop which doesn’t close the modal on click.
remote	path	false	This option is deprecated since v3.3.0 and has been removed in v4. We recommend instead using client-side templating or a data binding framework, or calling jQuery.load yourself.*** 如果提供的是 URL，将利用 jQuery 的 load 方法从此 URL 地址加载要展示的内容（只加载一次）并插入 .modal-content 内。如果使用的是 data 属性 API，还可以利用 href 属性指定内容来源地址。下面是一个实例： <a data-toggle="modal" href="remote.html" target="_blank" rel="external nofollow" data-target="#modal">Click me</a>

如 \color{#2d85f0}{如} 如 果 \color{#f4433c}{果} 果 感 \color{#ffbc32}{感} 感 觉 \color{#2d85f0}{觉} 觉 写 \color{#0aa858}{写} 写 的 \color{#f4433c}{的} 的 还 \color{#2d85f0}{还} 还 不 \color{#f4433c}{不} 不 错 \color{#ffbc32}{错} 错 ， \color{#2d85f0}{，} ， 不 \color{#0aa858}{不} 不 要 \color{#f4433c}{要} 要 忘 \color{#2d85f0}{忘} 忘 记 \color{#f4433c}{记} 记 点 赞 \color{#ffbc32}{点赞} 点赞 评 论 \color{#2d85f0}{评论} 评论 收 藏 \color{#0aa858}{收藏} 收藏 关 注 \color{#f4433c}{关注} 关注