Question

引导它是否使用Javascript？就像首先加载HTML然后JS代码分析我的引导模式的属性，并为此添加功能（淡入，淡出等）？它是否包含在某个地方的bootstrap.js中？

我知道它会触发一些事件，所以必须在Bootstrap的源代码中定义它们。

Answer 1

是。它使用Javascript Frame工作Jquery进行所有操作。 Bootstrap.js使用jquery并显示模态。

它使用HTML5 data attribute来调用模态。

<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>

引导程序中发生的所有操作都归因于以下文件。您可以在＆＃39; bootstrap.min.css＆＃39;

中找到所有课程

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

我希望那就是你所期待的。

Answer 2

是的，您可以从boostrap/modal.js

搜索以下代码

例如，

 $(document).on('click.bs.modal.data-api', '[data-toggle="modal"]', function (e) {
    var $this   = $(this)
    var href    = $this.attr('href')
    var $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) // strip for ie7
    var option  = $target.data('bs.modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())

    if ($this.is('a')) e.preventDefault()

    $target.one('show.bs.modal', function (showEvent) {
      if (showEvent.isDefaultPrevented()) return // only register focus restorer if modal will actually get shown
      $target.one('hidden.bs.modal', function () {
        $this.is(':visible') && $this.trigger('focus')
      })
    })
    Plugin.call($target, option, this)
  })

Bootstrap如何隐藏模态？

2 个答案: