in English

Awoṣe

Lo ohun itanna modal JavaScript Bootstrap lati ṣafikun awọn ibaraẹnisọrọ si aaye rẹ fun awọn apoti ina, awọn iwifunni olumulo, tabi akoonu aṣa patapata.

Bawo ni o ṣe n ṣiṣẹ

Ṣaaju ki o to bẹrẹ pẹlu paati modal Bootstrap, rii daju lati ka atẹle bi awọn aṣayan akojọ aṣayan wa ti yipada laipẹ.

Awọn awoṣe jẹ itumọ pẹlu HTML, CSS, ati JavaScript. Wọn wa ni ipo lori ohun gbogbo miiran ninu iwe naa ki o yọ yi lọ kuro ni <body>ki akoonu modal yi lọ dipo.
Tite lori modal “backdrop” yoo pa modal naa laifọwọyi.
Bootstrap nikan ṣe atilẹyin window modal kan ni akoko kan. Awọn awoṣe itẹle ko ni atilẹyin bi a ṣe gbagbọ pe wọn jẹ awọn iriri olumulo ti ko dara.
Modals lilo position: fixed, eyi ti o le ma jẹ kan bit pato nipa awọn oniwe- Rendering. Nigbakugba ti o ṣee ṣe, gbe HTML modal rẹ si ipo ipele oke lati yago fun kikọlu agbara lati awọn eroja miiran. O ṣee ṣe ki o lọ sinu awọn ọran nigbati o ba n gbe ile kan .modallaarin eroja ti o wa titi miiran.
Lekan si, nitori position: fixed, nibẹ ni o wa diẹ ninu awọn caveats pẹlu lilo modals lori awọn ẹrọ alagbeka. Wo awọn iwe atilẹyin ẹrọ aṣawakiri wa fun awọn alaye.
Nitori bi HTML5 ṣe n ṣalaye awọn itumọ-ọrọ rẹ, ẹda autofocusHTML ko ni ipa ni awọn awoṣe Bootstrap. Lati ṣaṣeyọri ipa kanna, lo diẹ ninu JavaScript aṣa:

$('#myModal').on('shown.bs.modal', function () {
  $('#myInput').trigger('focus')
})

Ipa iwara ti paati yii dale lori prefers-reduced-motionibeere media. Wo apakan išipopada ti o dinku ti iwe iraye si wa .

Jeki kika fun demos ati awọn ilana lilo.

Awọn apẹẹrẹ

Ni isalẹ jẹ apẹẹrẹ modal aimi (itumọ rẹ positionati displaype o ti bori). To wa pẹlu akọsori modal, ara modal (ti a beere fun padding), ati ẹlẹsẹ modal (aṣayan). A beere pe ki o pẹlu awọn akọle modal pẹlu awọn iṣe yiyọ kuro nigbakugba ti o ṣee ṣe, tabi pese igbese ifasilẹ gbangba miiran.

<div class="modal" tabindex="-1">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p>Modal body text goes here.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

Live demo

Yi demo modal ṣiṣẹ nipa tite bọtini ni isalẹ. Yoo rọra si isalẹ ati ipare ni lati oke ti oju-iwe naa.

<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
  Launch demo modal
</button>

<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

Aimi backdrop

Nigbati a ba ṣeto backdrop si aimi, modal naa kii yoo sunmọ nigbati o ba tẹ ita rẹ. Tẹ awọn bọtini ni isalẹ lati gbiyanju o.

<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#staticBackdrop">
  Launch static backdrop modal
</button>

<!-- Modal -->
<div class="modal fade" id="staticBackdrop" data-backdrop="static" data-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="staticBackdropLabel">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Understood</button>
      </div>
    </div>
  </div>
</div>

Yi lọ akoonu gun

Nigbati awọn awoṣe ba gun ju fun wiwo olumulo tabi ẹrọ, wọn yi lọ ni ominira ti oju-iwe naa funrararẹ. Gbiyanju demo ni isalẹ lati wo kini a tumọ si.

Ohun ti o tẹle jẹ diẹ ninu awọn ọrọ ibi-aye fun ibaraẹnisọrọ modal yii. Sipping lori Rosé, Silver Lake oorun, bọ soke gbogbo ọlẹ. O wa ni ọpẹ ti ọwọ rẹ ni bayi ọmọ. Nitorina a lu boulevard. Nitorinaa ṣe ifẹ, Emi yoo jẹ ki o dabi ọjọ-ibi rẹ lojoojumọ. Ṣe o lailai lero tẹlẹ sin jin mefa ẹsẹ labẹ? O to akoko lati mu awọn fọndugbẹ nla jade. O le ti jẹ ẹni ti o ga julọ. Awọn ontẹ iwe irinna, o ni agba aye. Ifẹnukonu rẹ jẹ agba aye, gbogbo gbigbe jẹ idan.

A n gbe aye. A n ṣe o tọ. Ṣii ọkan rẹ silẹ. Mo ti a ti gbiyanju lu o ati ki o olodun-o. Ifẹ rẹ dabi oogun. Nigbagbogbo fi oju-ọna ti stardust silẹ. Ọmọbinrin naa jẹ ijamba, o wakọ jeep kan ni Okun Laguna. Dara, alabapade, imuna, a ni lori titiipa. Gbogbo mi odomobirin ojoun Chanel omo.

Ṣaaju ki o to pade mi Mo wa dara ṣugbọn awọn nkan wuwo pupọ. Awọn ète Peach-Pink, Bẹẹni, gbogbo eniyan n wo. Eyi kii ṣe adehun nla. Npe oruko mi. Mo ti le tun rẹ afẹsodi. O ni iyẹn, je ko si wi, o mọ o. Eru ni ori ti o gbe ade. Nitori, ọmọ, o jẹ iṣẹ ina. Bi ãra yoo mì ilẹ.

Kan ni alẹ bi 4th ti Keje! Emi yoo fi i sinu coma. Ohun ti o n duro de, o to akoko fun ọ lati ṣafihan rẹ. Ko le ropo o pẹlu a million oruka. O la mi loju mo si setan lati lo, mu mi wa sinu imole. Ati pe o wa. Emi yoo fi i sinu coma. Wa, jẹ ki awọn awọ rẹ ti nwaye. Nitorina bo oju rẹ, Mo ni iyalenu kan. Bi mo ti rin nikan si lilu ti o yatọ. dake gbogbo lori yara Pink flamingos ninu awọn pool.

O kan ni lati tan ina naa ki o jẹ ki o tan! Wa gẹgẹ bi o ti wa si mi. O kan ni alẹ bi 4th ti Keje. Fi ife Re ba mi lowo, ki o si fi majele re kun mi. Wa gẹgẹ bi o ti wa si mi. Opin ti awọn Rainbow nwa iṣura.

Nko le sun e jeki a sa kuro ki a ma wo eyin lailai, mase wo eyin. Nko le sun e jeki a sa kuro ki a ma wo eyin lailai, mase wo eyin. Bẹ́ẹ̀ ni, àwa ń mú kí àwọn áńgẹ́lì kígbe, tí òjò rọ̀ sórí ilẹ̀ ayé láti òkè wá. Mo n rin lori afefe (alẹ oni). Jẹ ki o fi ọwọ rẹ le mi ni awọn sokoto awọ-ara mi. Tita bi oyin Mo gba awọn ila mi. Mo ti lọ lati odo, si ara mi akoni. Ani imọlẹ ju oṣupa, oṣupa, oṣupa. Jẹ ki wọn lọ, 'Aah, aah, aah' bi o ṣe n yinbọn kọja ọrun-yy! Kilode ti o ko jẹ ki n duro?

Ariwo, ariwo, ariwo. Kò ṣe mi seju ọkan akoko. Bẹẹni, o ni orire ti o ba wa lori ọkọ ofurufu rẹ. Soro nipa ojo iwaju wa bi a ti ni olobo. Olorun mi ko si abumọ. O jẹ atilẹba, ko le paarọ rẹ. Ọmọbinrin naa jẹ ijamba, o wakọ jeep kan ni Okun Laguna. Kì í ṣe ọ̀rọ̀ ńlá, kì í ṣe ọ̀rọ̀ ńlá, kì í ṣe ohun ńlá. Ni igbesi aye miiran Emi yoo jẹ ki o duro. Emi ni ma gba okan re ije ninu ara mi sokoto-ju. Mo fẹ rin lori gigun igbi rẹ ki o si wa nibẹ nigbati o gbọn Ma ṣe jẹ ki n fọju ni akoko kan.

A yoo mu gbogbo awọn ileri wa jẹ wa lodi si aye. Ti o ba ni aye o dara julọ lati tọju rẹ. O to akoko lati mu awọn fọndugbẹ nla, nla, nla, nla, nla, nla, nla jade. Mo nireti pe o ni ounjẹ to ni ilera. Maṣe jẹ ki titobi nla ba ọ silẹ, oh, Bẹẹni. Bẹẹni, o jẹ ẹlẹsẹ ati pe o nifẹ pupọ. Mo fẹ awọn bakan droppin', oju poppin', ori turnin', ara shockin'. Opin ti awọn Rainbow nwa iṣura.

O tun le ṣẹda modal yiyi ti o fun laaye yi lọ ara modal nipa fifi kun .modal-dialog-scrollablesi .modal-dialog.

Ohun ti o tẹle jẹ diẹ ninu awọn ọrọ ibi-aye fun ibaraẹnisọrọ modal yii. O kan ni lati tan ina naa ki o jẹ ki o tan! Wa gege bi o ti ri si mi. O kan ni alẹ bi 4th ti Keje. Fi ife Re ba mi lowo, ki o si fi majele re kun mi. Wa gege bi o ti ri si mi. Opin ti awọn Rainbow nwa iṣura.

A yoo mu gbogbo awọn ileri wa jẹ wa lodi si aye. Ni igbesi aye miiran Emi yoo jẹ ọmọbirin rẹ. A le jo, titi a o fi ku, iwọ ati emi, yoo jẹ ọdọ lailai. Ati ni ojo ibi 18th mi a ni awọn tatuu ti o baamu. Nitorinaa ṣii ọkan rẹ ki o kan jẹ ki o bẹrẹ. Nitoripe oun ni musiọmu ati olorin. O jẹ ọkan rẹ jade. Bi Jeffrey Dahmer (woo). Agbejade rẹ confetti. (Eyi ni bi a ṣe ṣe) Mo mọ pe ina kan yoo mọnamọna agbaye, bẹẹni bẹẹni. Ti o ba nikan mọ ohun ti ojo iwaju Oun ni.

Sipping lori Rosé, Silver Lake oorun, bọ soke gbogbo ọlẹ. O wa ni ọpẹ ti ọwọ rẹ ni bayi ọmọ. Nitorina a lu boulevard. Nitorinaa ṣe ifẹ, Emi yoo jẹ ki o dabi ọjọ-ibi rẹ lojoojumọ. Ṣe o lailai lero tẹlẹ sin jin mefa ẹsẹ labẹ? O to akoko lati mu awọn fọndugbẹ nla jade. O le ti jẹ ẹni ti o ga julọ. Awọn ontẹ iwe irinna, o ni agba aye. Ifẹnukonu rẹ jẹ agba aye, gbogbo gbigbe jẹ idan.

<!-- Scrollable modal -->
<div class="modal-dialog modal-dialog-scrollable">
  ...
</div>

Ni inaro aarin

Fi .modal-dialog-centeredsi .modal-dialoginaro aarin modal.

<!-- Vertically centered modal -->
<div class="modal-dialog modal-dialog-centered">
  ...
</div>

<!-- Vertically centered scrollable modal -->
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
  ...
</div>

Tooltips ati popovers

Awọn imọran irinṣẹ ati awọn agbejade le wa ni gbe laarin awọn modal bi o ṣe nilo. Nigbati modals ti wa ni pipade, eyikeyi awọn imọran irinṣẹ ati awọn agbejade laarin tun jẹ yọkuro laifọwọyi.

<div class="modal-body">
  <h5>Popover in a modal</h5>
  <p>This <a href="#" role="button" class="btn btn-secondary popover-test" title="Popover title" data-content="Popover body content is set in this attribute.">button</a> triggers a popover on click.</p>
  <hr>
  <h5>Tooltips in a modal</h5>
  <p><a href="#" class="tooltip-test" title="Tooltip">This link</a> and <a href="#" class="tooltip-test" title="Tooltip">that link</a> have tooltips on hover.</p>
</div>

Lilo awọn akoj

Lo eto akoj Bootstrap laarin modal nipasẹ itẹ-ẹiyẹ .container-fluidlaarin .modal-body. Lẹhinna, lo awọn kilasi eto akoj deede bi o ṣe le nibikibi miiran.

<div class="modal-body">
  <div class="container-fluid">
    <div class="row">
      <div class="col-md-4">.col-md-4</div>
      <div class="col-md-4 ml-auto">.col-md-4 .ml-auto</div>
    </div>
    <div class="row">
      <div class="col-md-3 ml-auto">.col-md-3 .ml-auto</div>
      <div class="col-md-2 ml-auto">.col-md-2 .ml-auto</div>
    </div>
    <div class="row">
      <div class="col-md-6 ml-auto">.col-md-6 .ml-auto</div>
    </div>
    <div class="row">
      <div class="col-sm-9">
        Level 1: .col-sm-9
        <div class="row">
          <div class="col-8 col-sm-6">
            Level 2: .col-8 .col-sm-6
          </div>
          <div class="col-4 col-sm-6">
            Level 2: .col-4 .col-sm-6
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

Ni opo ti awọn bọtini ti gbogbo awọn okunfa kanna modal pẹlu die-die o yatọ si awọn akoonu? Lo event.relatedTargetati awọn abuda HTMLdata-* (o ṣee ṣe nipasẹ jQuery ) lati ṣe iyatọ awọn akoonu ti modal da lori bọtini wo ni o tẹ.

Ni isalẹ ni demo ifiwe kan atẹle nipa apẹẹrẹ HTML ati JavaScript. Fun alaye diẹ sii, ka awọn docs awọn iṣẹlẹ modal fun awọn alaye lori relatedTarget.

<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">Open modal for @mdo</button>
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal" data-whatever="@fat">Open modal for @fat</button>
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal" data-whatever="@getbootstrap">Open modal for @getbootstrap</button>

<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">New message</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <form>
          <div class="form-group">
            <label for="recipient-name" class="col-form-label">Recipient:</label>
            <input type="text" class="form-control" id="recipient-name">
          </div>
          <div class="form-group">
            <label for="message-text" class="col-form-label">Message:</label>
            <textarea class="form-control" id="message-text"></textarea>
          </div>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Send message</button>
      </div>
    </div>
  </div>
</div>

$('#exampleModal').on('show.bs.modal', function (event) {
  var button = $(event.relatedTarget) // Button that triggered the modal
  var recipient = button.data('whatever') // Extract info from data-* attributes
  // If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
  // Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
  var modal = $(this)
  modal.find('.modal-title').text('New message to ' + recipient)
  modal.find('.modal-body input').val(recipient)
})

Yi iwara

Oniyipada $modal-fade-transformṣe ipinnu ipo iyipada ti .modal-dialogṣaaju ki modal fade-in animation, $modal-show-transformoniyipada ṣe ipinnu iyipada ti .modal-dialogni opin ti modal fade-in animation.

Ti o ba fẹ fun apẹẹrẹ ere idaraya sun-un, o le ṣeto $modal-fade-transform: scale(.8).

Yọ iwara kuro

Fun awọn awoṣe ti o han nirọrun kuku ju ipare sinu lati wo, yọ .fadekilasi kuro lati isamisi modal rẹ.

<div class="modal" tabindex="-1" aria-labelledby="..." aria-hidden="true">
  ...
</div>

Awọn giga ti o ni agbara

Ti giga modal ba yipada lakoko ti o wa ni sisi, o yẹ ki o pe $('#myModal').modal('handleUpdate')lati tun ipo ipo modal ṣe ni ọran ti lilọ kiri ba han.

Wiwọle

Rii daju lati ṣafikun aria-labelledby="...", tọka akọle modal, si .modal. Ni afikun, o le fun ni apejuwe ti ibaraẹnisọrọ modal rẹ pẹlu aria-describedbylori .modal. Ṣe akiyesi pe o ko nilo lati ṣafikun role="dialog"nitori a ti ṣafikun tẹlẹ nipasẹ JavaScript.

Ifisinu YouTube awọn fidio

Ifisinu awọn fidio YouTube ni awọn awoṣe nilo afikun JavaScript kii ṣe ni Bootstrap lati da ṣiṣiṣẹsẹhin duro laifọwọyi ati diẹ sii. Wo ifiweranṣẹ Stack Overflow ti o ṣe iranlọwọ fun alaye diẹ sii.

Awọn iwọn iyan

Awọn awoṣe ni awọn iwọn iyan mẹta, wa nipasẹ awọn kilasi modifier lati gbe sori faili .modal-dialog. Awọn iwọn wọnyi tapa ni awọn aaye isinmi kan lati yago fun awọn yiyi ti petele lori awọn iwoye ti o dín.

Iwọn	Kilasi	Modal max-iwọn
Kekere	`.modal-sm`	`300px`
Aiyipada	Ko si	`500px`
Tobi	`.modal-lg`	`800px`
Afikun nla	`.modal-xl`	`1140px`

Modal aiyipada wa laisi kilasi modifier jẹ iwọn “alabọde” iwọn modal.

<div class="modal-dialog modal-xl">...</div>
<div class="modal-dialog modal-lg">...</div>
<div class="modal-dialog modal-sm">...</div>

Lilo

Ohun itanna modal yi akoonu ti o farapamọ pada lori ibeere, nipasẹ awọn abuda data tabi JavaScript. O tun ṣe afikun .modal-opensi <body>lati bori ihuwasi yiyi lọ aiyipada ati ṣe ipilẹṣẹ kan .modal-backdroplati pese agbegbe tẹ kan fun yiyọ awọn awoṣe ti o han nigbati titẹ si ita modal.

Nipasẹ awọn abuda data

Mu modal ṣiṣẹ laisi kikọ JavaScript. Ṣeto data-toggle="modal"lori eroja oludari, bii bọtini kan, pẹlu kan data-target="#foo"tabi href="#foo"lati fojusi modal kan pato lati yi.

<button type="button" data-toggle="modal" data-target="#myModal">Launch modal</button>

Nipasẹ JavaScript

Pe modal pẹlu id myModalpẹlu laini JavaScript kan:

$('#myModal').modal(options)

Awọn aṣayan

Awọn aṣayan le ṣee kọja nipasẹ awọn abuda data tabi JavaScript. Fun awọn abuda data, fi orukọ aṣayan si data-, bi ninu data-backdrop="".

Oruko	Iru	Aiyipada	Apejuwe
sile	boolian tabi okun`'static'`	ooto	Pẹlu a modal-backdrop ano. Ni omiiran, pato `static`fun ẹhin ẹhin eyiti ko pa modal naa ni titẹ.
keyboard	boolian	ooto	Tilekun modal nigbati o ba tẹ bọtini ona abayo
idojukọ	boolian	ooto	Fi idojukọ lori modal nigba ti ipilẹṣẹ.
ifihan	boolian	ooto	Ṣe afihan modal nigbati o bẹrẹ.

Awọn ọna

Awọn ọna Asynchronous ati awọn iyipada

Gbogbo awọn ọna API jẹ asynchronous ati bẹrẹ iyipada kan . Wọn pada si ọdọ olupe ni kete ti iyipada ti bẹrẹ ṣugbọn ṣaaju ki o to pari . Ni afikun, ipe ọna kan lori paati iyipada yoo jẹ kọbikita .

Wo iwe JavaScript wa fun alaye diẹ sii .

`.modal(options)`

Mu akoonu rẹ ṣiṣẹ bi modal. Gba awọn aṣayan iyan object.

$('#myModal').modal({
  keyboard: false
})

`.modal('toggle')`

Pẹlu ọwọ yipada modal kan. Pada si olupe ṣaaju ki modal ti han gangan tabi farapamọ (ie ṣaaju ki iṣẹlẹ shown.bs.modaltabi hidden.bs.modaliṣẹlẹ waye).

$('#myModal').modal('toggle')

`.modal('show')`

Pẹlu ọwọ ṣii modal kan. Pada si olupe ṣaaju ki modal ti han gangan (ie ṣaaju ki shown.bs.modaliṣẹlẹ naa to waye).

$('#myModal').modal('show')

`.modal('hide')`

Pẹlu ọwọ hides a modal. Pada si olupe ṣaaju ki modal naa ti farapamọ gangan (ie ṣaaju ki hidden.bs.modaliṣẹlẹ naa to waye).

$('#myModal').modal('hide')

`.modal('handleUpdate')`

Ṣe atunṣe ipo modal pẹlu ọwọ ti giga modal ba yipada lakoko ti o wa ni sisi (ie ti o ba jẹ pe yiyi yoo han).

$('#myModal').modal('handleUpdate')

`.modal('dispose')`

Pa ohun ano ká modal.

Awọn iṣẹlẹ

Kilasi modal Bootstrap ṣafihan awọn iṣẹlẹ diẹ fun sisọ sinu iṣẹ ṣiṣe modal. Gbogbo awọn iṣẹlẹ modal jẹ ina ni modal funrararẹ (ie ni <div class="modal">).

Iṣẹlẹ Iru	Apejuwe
fihan.bs.modal	Yi iṣẹlẹ ina lẹsẹkẹsẹ nigbati awọn `show`apẹẹrẹ ọna ti a npe ni. Ti o ba ṣẹlẹ nipasẹ titẹ kan, eroja ti o tẹ wa bi `relatedTarget`ohun-ini ti iṣẹlẹ naa.
han.bs.modal	Iṣẹlẹ yii jẹ ina nigbati modal ti jẹ ki o han si olumulo (yoo duro fun awọn iyipada CSS lati pari). Ti o ba ṣẹlẹ nipasẹ titẹ kan, eroja ti o tẹ wa bi `relatedTarget`ohun-ini ti iṣẹlẹ naa.
tọju.bs.modal	Iṣẹlẹ yii jẹ ina lẹsẹkẹsẹ nigbati ọna `hide`apẹẹrẹ ti pe.
farasin.bs.modal	Iṣẹlẹ yii jẹ ina nigbati modal naa ba ti pari fifipamọ lati ọdọ olumulo (yoo duro fun awọn iyipada CSS lati pari).
hidePrevented.bs.modal	Iṣẹlẹ yii jẹ ina nigbati modal ba han, ẹhin rẹ jẹ `static`ati tẹ ni ita modal tabi bọtini abayo ti tẹ pẹlu aṣayan bọtini itẹwe tabi `data-keyboard`ṣeto si `false`.

$('#myModal').on('hidden.bs.modal', function (event) {
  // do something...
})