Litemoso
Fana ka melaetsa ea maikutlo bakeng sa liketso tse tloaelehileng tsa basebelisi ka melaetsa e seng mekae e fumanehang le e bonolo.
Mehlala
Litlhokomeliso li teng bakeng sa bolelele bofe kapa bofe ba mongolo, hammoho le konopo ea boikhethelo ea ho qhala. Bakeng sa setaele se nepahetseng, sebelisa e 'ngoe ea lihlopha tse robeli tse hlokahalang tsa maemo (mohlala, .alert-success
). Bakeng sa ho leleka ka har'a marang-rang, sebelisa plugin ea tlhokomeliso ea jQuery .
<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>
Ho fetisa moelelo ho litheknoloji tse thusang
Ho sebelisa mebala ho eketsa moelelo ho fana feela ka pontšo ea pono, e ke keng ea fetisetsoa ho basebelisi ba theknoloji e thusang - joalo ka sebali sa skrine. Netefatsa hore tlhahisoleseding e hlahisitsweng ke mmala e ka ba e totobetseng ho tswa ho dikahare ka boyona (mohlala, mongolo o bonahalang), kapa e kenyeleditswe ka mekgwa e meng, e kang mongolo o tlatsetso o patilweng le .sr-only
sehlopha.
Mmala oa khokahano
Sebelisa sehlopha sa .alert-link
lisebelisoa ho fana ka lihokelo tsa mebala tse nyallanang ka har'a tlhokomeliso efe kapa efe.
<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>
Litaba tse ling
Litlhokomeliso li ka boela tsa ba le likarolo tse ling tsa HTML tse kang lihlooho, lirapa le likarohano.
Mosebetsi o motle!
Aww yeah, u atlehile ho bala molaetsa ona oa bohlokoa oa tlhokomeliso. Mohlala ona oa mongolo o tla nka nako e teletsana hore o tle o bone hore na sebaka se ka har'a tlhokomeliso se sebetsa joang le mofuta ona oa litaba.
Nako le nako ha u hloka, etsa bonnete ba hore u sebelisa lisebelisoa tsa marang-rang ho boloka lintho li le ntle ebile li le makhethe.
<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>
Ho qhala
Ka ho sebelisa plugin ea temoso ea JavaScript, hoa khoneha ho qhelela tlhokomeliso efe kapa efe e ka har'a mohala. Mokhoa ona ke ona:
- Etsa bonnete ba hore u kentse plugin ea tlhokomeliso, kapa Bootstrap JavaScript e hlophisitsoeng.
- Haeba u theha JavaScript ea rona ho tsoa mohloling, e hloka
util.js
. Phetolelo e hlophisitsoeng e kenyelletsa sena. - Kenya konopo ea ho qhala le
.alert-dismissible
sehlopha, e leng se eketsang padding ka letsohong le letona la tlhokomeliso le ho beha.close
konopo. - Ho konopo ea ho tlosa, eketsa
data-dismiss="alert"
tšobotsi, e hlahisang ts'ebetso ea JavaScript. Etsa bonnete ba hore o sebelisa<button>
element le eona bakeng sa boitšoaro bo nepahetseng ho lisebelisoa tsohle. - Ho phelisa litlhokomeliso ha u li leleka, etsa bonnete ba hore u eketsa
.fade
le.show
litlelase.
U ka bona sena ts'ebetsong ka demo e phelang:
<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>
Boitšoaro ba JavaScript
Lintho tse susumetsang
Lumella ho tlosoa ha tlhokomeliso ka JavaScript:
$('.alert').alert()
Kapa ka data
litšoaneleho konopo ka har'a tlhokomeliso , joalo ka ha ho bonts'itsoe ka holimo:
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
Hlokomela hore ho koala tlhokomeliso ho tla e tlosa ho DOM.
Mekhoa
Mokhoa | Tlhaloso |
---|---|
$().alert() |
E fana ka tlhokomeliso bakeng sa diketsahalo tsa ho tobetsa lintho tse hlahang tse nang le data-dismiss="alert" tšobotsi. (Ha ho hlokahale ha o sebelisa data-api's auto-initialization.) |
$().alert('close') |
E koala tlhokomeliso ka ho e tlosa ho DOM. Haeba li- .fade class .show li le teng ho element, tlhokomeliso e tla nyamela pele e tlosoa. |
$().alert('dispose') |
E senya tlhokomeliso ea element. |
$('.alert').alert('close')
Liketsahalo
Sesebelisoa sa tlhokomeliso sa Bootstrap se pepesa liketsahalo tse 'maloa bakeng sa ho hokahana le ts'ebetso ea tlhokomeliso.
Ketsahalo | Tlhaloso |
---|---|
close.bs.alert |
Ketsahalo ena e tuka hang hang ha close mokhoa oa mohlala o bitsoa. |
closed.bs.alert |
Ketsahalo ena e ts'oaroa ha tlhokomeliso e koetsoe (e tla emela hore liphetoho tsa CSS li phethehe). |
$('#myAlert').on('closed.bs.alert', function () {
// do something...
})