/ / Как Bootstrap скрива модала? - javascript, twitter-bootstrap-3, bootstrap-modal

Как Bootstrap скрива модала? - javascript, twitter-bootstrap-3, bootstrap-modal

Дали bootstrap го използва Javascript за това? Подобно на това, HTML се зарежда първо и след това JS кодът анализира атрибутите на моя модул за bootstrap и добавя функционалност към това (избледнявам, избледнявам и т.н.)? Включено ли е в bootstrap.js някъде?

Знам, че пораждат някои събития например, така че те трябва да бъдат дефинирани в изходния код на Bootstrap.

Отговори:

0 за отговор № 1

Да. Той използва Javascript Frame работа Jquery за всички действия. Bootstrap.js използва jquery и показва модала.

Той използва HTML5 атрибут данни да се обадя на повикващия.

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

Всичко, което се случва в bootstrap се дължи на следните файлове. Всички класове можете да намерите в "bootstrap.min.css"

<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>

Надявам се, че това, което търсите.


0 за отговор № 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)
})