Darparu negeseuon adborth cyd-destunol ar gyfer gweithredoedd arferol defnyddwyr gyda llond llaw o negeseuon rhybudd hyblyg sydd ar gael.
Enghreifftiau
Mae rhybuddion ar gael ar gyfer unrhyw hyd o destun, yn ogystal â botwm diswyddo dewisol. Ar gyfer steilio cywir, defnyddiwch un o'r wyth dosbarth cyd-destunol gofynnol.alert-success (ee, ). Ar gyfer diswyddo mewnol, defnyddiwch yr ategyn rhybuddion jQuery .
Rhybudd sylfaenol syml - edrychwch arno!
Rhybudd eilaidd syml - edrychwch arno!
Rhybudd llwyddiant syml - edrychwch arno!
Rhybudd perygl syml - edrychwch arno!
Rhybudd rhybudd syml - edrychwch arno!
Rhybudd gwybodaeth syml - edrychwch arno!
Rhybudd ysgafn syml - edrychwch arno!
Rhybudd tywyll syml - edrychwch arno!
Cyfleu ystyr i dechnolegau cynorthwyol
Mae defnyddio lliw i ychwanegu ystyr yn rhoi arwydd gweledol yn unig, na fydd yn cael ei gyfleu i ddefnyddwyr technolegau cynorthwyol - megis darllenwyr sgrin. Sicrhewch fod gwybodaeth a ddynodir gan y lliw naill ai'n amlwg o'r cynnwys ei hun (ee y testun gweladwy), neu'n cael ei chynnwys trwy ddulliau amgen, megis testun ychwanegol wedi'i guddio gyda'r .sr-onlydosbarth.
Lliw cyswllt
Defnyddiwch y .alert-linkdosbarth cyfleustodau i ddarparu dolenni lliw cyfatebol yn gyflym o fewn unrhyw rybudd.
Rhybudd sylfaenol syml gyda
dolen enghreifftiol . Rhowch glic iddo os dymunwch.
Rhybudd eilaidd syml gyda
dolen enghreifftiol . Rhowch glic iddo os dymunwch.
Rhybudd llwyddiant syml gyda
dolen enghreifftiol . Rhowch glic iddo os dymunwch.
Rhybudd perygl syml gyda
dolen enghreifftiol . Rhowch glic iddo os dymunwch.
Rhybudd rhybudd syml gyda
dolen enghreifftiol . Rhowch glic iddo os dymunwch.
Rhybudd gwybodaeth syml gyda
dolen enghreifftiol . Rhowch glic iddo os dymunwch.
Rhybudd tywyll syml gyda
dolen enghreifftiol . Rhowch glic iddo os dymunwch.
Cynnwys ychwanegol
Gall rhybuddion hefyd gynnwys elfennau HTML ychwanegol fel penawdau, paragraffau a rhanwyr.
Da iawn!
Aww ie, rydych chi wedi darllen y neges rhybuddio bwysig hon yn llwyddiannus. Mae'r testun enghreifftiol hwn yn mynd i redeg ychydig yn hirach fel y gallwch weld sut mae bylchau o fewn rhybudd yn gweithio gyda'r math hwn o gynnwys.
Pryd bynnag y bydd angen, gwnewch yn siŵr eich bod chi'n defnyddio cyfleustodau ymyl i gadw pethau'n braf ac yn daclus.
Diswyddo
Gan ddefnyddio'r ategyn rhybuddio JavaScript, mae'n bosibl diystyru unrhyw rybudd ar-lein. Dyma sut:
Gwnewch yn siŵr eich bod wedi llwytho'r ategyn rhybuddio, neu'r Bootstrap JavaScript a luniwyd.
Os ydych chi'n adeiladu ein JavaScript o'r ffynhonnell, mae angenutil.js . Mae'r fersiwn a luniwyd yn cynnwys hyn.
Ychwanegu botwm diswyddo a'r .alert-dismissibledosbarth, sy'n ychwanegu padin ychwanegol i'r dde o'r rhybudd ac yn gosod y .closebotwm.
Ar y botwm diswyddo, ychwanegwch y data-dismiss="alert"priodoledd, sy'n sbarduno ymarferoldeb JavaScript. Byddwch yn siwr i ddefnyddio'r <button>elfen ag ef ar gyfer ymddygiad priodol ar draws pob dyfais.
I animeiddio rhybuddion wrth eu diswyddo, gofalwch eich bod yn ychwanegu'r .fadea .showdosbarthiadau.
Gallwch weld hyn ar waith gyda demo byw:
Sanctaidd guacamole! Dylech wirio rhai o'r meysydd hynny isod.
Ymddygiad JavaScript
Sbardunau
Galluogi diswyddo rhybudd trwy JavaScript:
Neu gyda dataphriodoleddau ar fotwm o fewn y rhybudd , fel y dangosir uchod:
Sylwch y bydd cau rhybudd yn ei dynnu o'r DOM.
Dulliau
Dull
Disgrifiad
$().alert()
Yn gwneud rhybudd yn gwrando am ddigwyddiadau clicio ar elfennau disgynnol sydd â'r data-dismiss="alert"priodoledd. (Ddim yn angenrheidiol wrth ddefnyddio awto-gychwyn y data-api.)
$().alert('close')
Yn cau rhybudd trwy ei dynnu o'r DOM. Os yw'r .fadea .showdosbarthiadau yn bresennol ar yr elfen, bydd y rhybudd yn diflannu cyn iddo gael ei dynnu.
$().alert('dispose')
Yn dinistrio rhybudd elfen.
Digwyddiadau
Mae ategyn rhybuddio Bootstrap yn datgelu rhai digwyddiadau i'w cysylltu â swyddogaethau rhybuddio.
Digwyddiad
Disgrifiad
close.bs.alert
Mae'r digwyddiad hwn yn tanio ar unwaith pan closeelwir y dull enghraifft.
closed.bs.alert
Mae'r digwyddiad hwn yn cael ei danio pan fydd y rhybudd wedi'i gau (bydd yn aros i'r trawsnewidiadau CSS gael eu cwblhau).