Fa'aliga
Tuuina atu fe'au fa'amatalaga fa'atatau mo fa'atinoga masani a tagata fa'aoga fa'atasi ai ma le lima o fe'au mataala avanoa ma fetu'una'i.
Faataitaiga
E avanoa fa'aaliga mo so'o se umi o tusitusiga, fa'apea fo'i ma se fa'amau fa'ate'a. Mo le fa'avasega lelei, fa'aaoga se tasi o vasega fa'atatau e valu e mana'omia (fa'ata'ita'iga, .alert-success
). Mo le fa'ate'aina i totonu, fa'aoga le fa'alilolilo jQuery plugin .
<div class="alert alert-primary" role="alert">
A simple primary alert—check it out!
</div>
<div class="alert alert-secondary" role="alert">
A simple secondary alert—check it out!
</div>
<div class="alert alert-success" role="alert">
A simple success alert—check it out!
</div>
<div class="alert alert-danger" role="alert">
A simple danger alert—check it out!
</div>
<div class="alert alert-warning" role="alert">
A simple warning alert—check it out!
</div>
<div class="alert alert-info" role="alert">
A simple info alert—check it out!
</div>
<div class="alert alert-light" role="alert">
A simple light alert—check it out!
</div>
<div class="alert alert-dark" role="alert">
A simple dark alert—check it out!
</div>
Tu'uina atu le uiga i tekinolosi fesoasoani
O le fa'aogaina o le lanu e fa'aopoopo ai le uiga e na'o se fa'aaliga va'aia, e le fa'ailoa atu i tagata fa'aoga o tekonolosi fesoasoani - e pei o le au faitau mata. Ia fa'amautinoa o fa'amatalaga o lo'o fa'ailogaina i le lanu e manino mai le anotusi lava ia (fa'ata'ita'iga o tusitusiga va'aia), pe fa'aofi mai i isi auala, e pei o tusitusiga fa'aopoopo natia i le .sr-only
vasega.
Lanu so'oga
Fa'aoga le .alert-link
vasega aoga e vave tu'uina atu ai so'otaga lanu tutusa i totonu o so'o se mataala.
<div class="alert alert-primary" role="alert">
A simple primary alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-secondary" role="alert">
A simple secondary alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-success" role="alert">
A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-danger" role="alert">
A simple danger alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-warning" role="alert">
A simple warning alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-info" role="alert">
A simple info alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-light" role="alert">
A simple light alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-dark" role="alert">
A simple dark alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
Fa'aopoopo anotusi
E mafai fo'i ona iai fa'amatalaga HTML fa'aopoopo e pei o ulutala, parakalafa ma vaeluaga.
Malo lava!
Oka ioe, na e faitauina ma le manuia lenei savali mataala taua. O le fa'ata'ita'iga fa'amatalaga o le a fai sina umi e te va'ai ai pe fa'afefea ona fa'aogaina le avanoa i totonu o le mataala ma lenei ituaiga o anotusi.
Soo se taimi lava e te manaʻomia ai, ia mautinoa e faʻaaoga mea faʻaoga e teu ai mea lelei ma mama.
<div class="alert alert-success" role="alert">
<h4 class="alert-heading">Well done!</h4>
<p>Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.</p>
<hr>
<p class="mb-0">Whenever you need to, be sure to use margin utilities to keep things nice and tidy.</p>
</div>
Fa'ate'aina
I le fa'aogaina o le fa'apipi'i JavaScript alert, e mafai ona fa'ate'aina so'o se mataala i totonu. O le auala lenei:
- Ia mautinoa ua e utaina le masini mataala, poʻo le Bootstrap JavaScript ua tuufaatasia.
- Afai o loʻo e fausiaina la matou JavaScript mai le puna, e manaʻomia
util.js
. O le lomiga tuufaatasia e aofia ai lenei. - Fa'aopoopo i ai le fa'amau fa'ate'a ma le
.alert-dismissible
vasega, lea e fa'aopoopoina ai le fa'ailoga fa'aopoopo i le itu taumatau o le mataala ma fa'atulaga le.close
ki. - I luga o le fa'ate'a fa'amau, fa'aopoopo le
data-dismiss="alert"
uiga, lea e fa'aoso ai le fa'atinoga o le JavaScript. Ia mautinoa e faʻaaoga le<button>
elemene mo le amio talafeagai i masini uma. - Ina ia fa'aola fa'aaliga pe a fa'ate'aina, ia mautinoa e fa'aopoopo le
.fade
ma.show
vasega.
E mafai ona e vaʻaia lenei mea i le gaioiga ma se faʻaaliga ola:
<div class="alert alert-warning alert-dismissible fade show" role="alert">
<strong>Holy guacamole!</strong> You should check in on some of those fields below.
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
Amioga JavaScript
Fa'aoso
Fa'aaga le fa'ate'aina o se mataala e ala i le JavaScript:
$('.alert').alert()
Po'o fa'atasi ma data
uiga i luga o se fa'amau i totonu o le mataala , e pei ona fa'aalia i luga:
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
Manatua o le tapunia o se mataala o le a aveesea mai le DOM.
Metotia
Metotia | Fa'amatalaga |
---|---|
$().alert() |
Faia se mataala e fa'alogo mo kiliki mea e tutupu i elemene tupuaga o lo'o iai le data-dismiss="alert" uiga. (E le manaʻomia pe a faʻaaogaina le faʻamatalaga-autometi a le data-api.) |
$().alert('close') |
Tapuni se mataala e ala i le aveese mai le DOM. Afai o le .fade ma .show vasega o loʻo i ai i luga o le elemene, o le mataala o le a mou ese atu aʻo leʻi aveesea. |
$().alert('dispose') |
Fa'aleagaina le mataala o se elemene. |
$('.alert').alert('close')
Mea na tutupu
O le plugin alert a Bootstrap e fa'aalia ai ni nai mea na tutupu mo le fa'aogaina i galuega mataala.
Mea na tupu | Fa'amatalaga |
---|---|
close.bs.alert |
E mu vave lenei mea pe a close valaʻau le auala faʻataʻitaʻiga. |
closed.bs.alert |
O lenei mea e tupu pe a tapunia le mataala (o le a faʻatali mo suiga CSS e maeʻa). |
$('#myAlert').on('closed.bs.alert', function () {
// do something...
})