అందుబాటులో ఉన్న మరియు సౌకర్యవంతమైన హెచ్చరిక సందేశాలతో సాధారణ వినియోగదారు చర్యల కోసం సందర్భోచిత అభిప్రాయ సందేశాలను అందించండి.
ఉదాహరణలు
టెక్స్ట్ యొక్క ఏదైనా పొడవు కోసం హెచ్చరికలు అందుబాటులో ఉంటాయి, అలాగే ఐచ్ఛిక తొలగింపు బటన్. సరైన స్టైలింగ్ కోసం, అవసరమైన ఎనిమిది సందర్భోచిత తరగతుల్లో ఒకదాన్ని ఉపయోగించండి (ఉదా, .alert-success). ఇన్లైన్ తొలగింపు కోసం, హెచ్చరికలను ఉపయోగించండి j క్వెరీ ప్లగ్ఇన్ .
ఒక సాధారణ ప్రాథమిక హెచ్చరిక-దీన్ని తనిఖీ చేయండి!
ఒక సాధారణ ద్వితీయ హెచ్చరిక-దీన్ని తనిఖీ చేయండి!
ఒక సాధారణ విజయ హెచ్చరిక-దీన్ని తనిఖీ చేయండి!
ఒక సాధారణ ప్రమాద హెచ్చరిక-దీన్ని తనిఖీ చేయండి!
ఒక సాధారణ హెచ్చరిక హెచ్చరిక-దీన్ని తనిఖీ చేయండి!
ఒక సాధారణ సమాచార హెచ్చరిక-దీన్ని తనిఖీ చేయండి!
ఒక సాధారణ కాంతి హెచ్చరిక-దీన్ని తనిఖీ చేయండి!
ఒక సాధారణ చీకటి హెచ్చరిక-దీన్ని తనిఖీ చేయండి!
సహాయక సాంకేతికతలకు అర్థాన్ని తెలియజేయడం
అర్థాన్ని జోడించడానికి రంగును ఉపయోగించడం అనేది దృశ్యమాన సూచనను మాత్రమే అందిస్తుంది, ఇది స్క్రీన్ రీడర్ల వంటి సహాయక సాంకేతికతల వినియోగదారులకు తెలియజేయబడదు. రంగు ద్వారా సూచించబడిన సమాచారం కంటెంట్లోనే స్పష్టంగా ఉందని (ఉదా. కనిపించే వచనం) లేదా .sr-onlyక్లాస్తో దాచిన అదనపు వచనం వంటి ప్రత్యామ్నాయ మార్గాల ద్వారా చేర్చబడిందని నిర్ధారించుకోండి.
లింక్ రంగు
.alert-linkఏదైనా అలర్ట్లో సరిపోలే రంగుల లింక్లను త్వరగా అందించడానికి యుటిలిటీ క్లాస్ని ఉపయోగించండి .
ఉదాహరణ లింక్తో
కూడిన సాధారణ ప్రాథమిక హెచ్చరిక
. మీకు నచ్చితే ఒక క్లిక్ ఇవ్వండి.
ఉదాహరణ లింక్తో
కూడిన సాధారణ ద్వితీయ హెచ్చరిక
. మీకు నచ్చితే ఒక క్లిక్ ఇవ్వండి.
ఉదాహరణ లింక్తో
సరళమైన విజయ హెచ్చరిక
. మీకు నచ్చితే ఒక క్లిక్ ఇవ్వండి.
ఉదాహరణ లింక్తో
కూడిన సాధారణ ప్రమాద హెచ్చరిక
. మీకు నచ్చితే ఒక క్లిక్ ఇవ్వండి.
ఉదాహరణ లింక్తో
కూడిన సాధారణ హెచ్చరిక హెచ్చరిక
. మీకు నచ్చితే ఒక క్లిక్ ఇవ్వండి.
ఉదాహరణ లింక్తో
కూడిన సాధారణ సమాచార హెచ్చరిక
. మీకు నచ్చితే ఒక క్లిక్ ఇవ్వండి.
ఉదాహరణ లింక్తో
కూడిన సాధారణ కాంతి హెచ్చరిక
. మీకు నచ్చితే ఒక క్లిక్ ఇవ్వండి.
ఉదాహరణ లింక్తో
కూడిన సాధారణ చీకటి హెచ్చరిక
. మీకు నచ్చితే ఒక క్లిక్ ఇవ్వండి.
అదనపు కంటెంట్
హెచ్చరికలు శీర్షికలు, పేరాగ్రాఫ్లు మరియు డివైడర్ల వంటి అదనపు HTML మూలకాలను కూడా కలిగి ఉండవచ్చు.
బాగా చేసారు!
ఔను, మీరు ఈ ముఖ్యమైన హెచ్చరిక సందేశాన్ని విజయవంతంగా చదివారు. ఈ ఉదాహరణ వచనం కొంచెం ఎక్కువసేపు పని చేస్తుంది, తద్వారా అలర్ట్లోని అంతరం ఈ రకమైన కంటెంట్తో ఎలా పని చేస్తుందో మీరు చూడవచ్చు.
మీకు అవసరమైనప్పుడు, విషయాలు చక్కగా మరియు చక్కగా ఉంచడానికి మార్జిన్ యుటిలిటీలను ఉపయోగించాలని నిర్ధారించుకోండి.
తొలగిస్తోంది
హెచ్చరిక జావాస్క్రిప్ట్ ప్లగ్ఇన్ని ఉపయోగించి, ఏదైనా హెచ్చరిక ఇన్లైన్ని తీసివేయడం సాధ్యమవుతుంది. ఇక్కడ ఎలా ఉంది:
మీరు హెచ్చరిక ప్లగిన్ లేదా కంపైల్ చేసిన బూట్స్ట్రాప్ జావాస్క్రిప్ట్ని లోడ్ చేశారని నిర్ధారించుకోండి.
మీరు మూలం నుండి మా జావాస్క్రిప్ట్ని రూపొందిస్తున్నట్లయితే, దీనికి అవసరంutil.js . సంకలనం చేయబడిన సంస్కరణ దీనిని కలిగి ఉంటుంది.
డిస్మిస్ బటన్ మరియు .alert-dismissibleక్లాస్ను జోడించండి, ఇది హెచ్చరికకు కుడి వైపున అదనపు పాడింగ్ను జోడించి బటన్ను ఉంచుతుంది .close.
డిస్మిస్ బటన్లో, data-dismiss="alert"జావాస్క్రిప్ట్ కార్యాచరణను ప్రేరేపించే లక్షణాన్ని జోడించండి. <button>అన్ని పరికరాలలో సరైన ప్రవర్తన కోసం దానితో ఎలిమెంట్ని ఉపయోగించాలని నిర్ధారించుకోండి .
అలర్ట్లను తీసివేసేటప్పుడు వాటిని యానిమేట్ చేయడానికి, వాటిని .fadeమరియు .showతరగతులను జ��డించాలని నిర్ధారించుకోండి.
లైవ్ డెమోతో మీరు దీన్ని చర్యలో చూడవచ్చు:
పవిత్ర గ్వాకామోల్! మీరు దిగువన ఉన్న వాటిలో కొన్నింటిని తనిఖీ చేయాలి.
జావాస్క్రిప్ట్ ప్రవర్తన
ట్రిగ్గర్స్
జావాస్క్రిప్ట్ ద్వారా హెచ్చరికను తొలగించడాన్ని ప్రారంభించండి:
లేదా పైన ప్రదర్శించిన విధంగా హెచ్చరిక లోపల ఉన్నdata బటన్పై లక్షణాలతో :
హెచ్చరికను మూసివేయడం వలన అది DOM నుండి తీసివేయబడుతుందని గుర్తుంచుకోండి.
పద్ధతులు
పద్ధతి
వివరణ
$().alert()
data-dismiss="alert"లక్షణాన్ని కలిగి ఉన్న డిసెండెంట్ ఎలిమెంట్లపై క్లిక్ ఈవెంట్ల కోసం హెచ్చరికను వినేలా చేస్తుంది . (డేటా-api యొక్క ఆటో-ఇనిషియలైజేషన్ని ఉపయోగిస్తున్నప్పుడు అవసరం లేదు.)
$().alert('close')
హెచ్చరికను DOM నుండి తీసివేయడం ద్వారా దాన్ని మూసివేస్తుంది. మూలకంపై .fadeమరియు తరగతులు ఉన్నట్లయితే , అది తీసివేయబడక ముందే హెచ్చరిక మసకబారుతుంది..show
$().alert('dispose')
మూలకం యొక్క హెచ్చరికను నాశనం చేస్తుంది.
ఈవెంట్స్
బూట్స్ట్రాప్ యొక్క హెచ్చరిక ప్లగ్ఇన్ హెచ్చరిక కార్యాచరణలో హుక్ చేయడం కోసం కొన్ని ఈవెంట్లను బహిర్గతం చేస్తుంది.
ఈవెంట్
వివరణ
close.bs.alert
ఇన్స్టెన్స్ మెథడ్ని పిలిచినప్పుడు ఈ ఈవెంట్ వెంటనే ఫైర్ అవుతుంది close.
closed.bs.alert
హెచ్చరిక మూసివేయబడినప్పుడు ఈ ఈవెంట్ తొలగించబడుతుంది (CSS పరివర్తనాలు పూర్తయ్యే వరకు వేచి ఉంటుంది).