கிடைக்கக்கூடிய மற்றும் நெகிழ்வான எச்சரிக்கைச் செய்திகளுடன் வழக்கமான பயனர் செயல்களுக்கான சூழல் சார்ந்த கருத்துச் செய்திகளை வழங்கவும்.
எடுத்துக்காட்டுகள்
உரையின் எந்த நீளத்திற்கும் விழிப்பூட்டல்கள் கிடைக்கின்றன, அத்துடன் விருப்பமான நிராகரிப்பு பொத்தான். சரியான ஸ்டைலிங்கிற்கு, தேவைப்படும் எட்டு சூழ்நிலை வகுப்புகளில் ஒன்றைப் பயன்படுத்தவும் (எ.கா., .alert-success). இன்லைன் நீக்கத்திற்கு, விழிப்பூட்டல்களைப் பயன்படுத்தவும் jQuery சொருகி .
ஒரு எளிய முதன்மை எச்சரிக்கை-இதைச் சரிபார்க்கவும்!
ஒரு எளிய இரண்டாம் நிலை எச்சரிக்கை-இதைப் பாருங்கள்!
ஒரு எளிய வெற்றி எச்சரிக்கை-இதைப் பாருங்கள்!
ஒரு எளிய ஆபத்து எச்சரிக்கை-இதைப் பாருங்கள்!
ஒரு எளிய எச்சரிக்கை எச்சரிக்கை-இதைப் பாருங்கள்!
ஒரு எளிய தகவல் விழிப்பூட்டல்-பாருங்கள்!
ஒரு எளிய ஒளி எச்சரிக்கை-இதைச் சரிபார்க்கவும்!
ஒரு எளிய இருண்ட எச்சரிக்கை-இதைச் சரிபார்க்கவும்!
உதவி தொழில்நுட்பங்களுக்கு அர்த்தத்தை வெளிப்படுத்துதல்
பொருளைச் சேர்க்க வண்ணத்தைப் பயன்படுத்துவது ஒரு காட்சிக் குறிப்பை மட்டுமே வழங்குகிறது, இது ஸ்கிரீன் ரீடர்கள் போன்ற உதவித் தொழில்நுட்பங்களைப் பயன்படுத்துபவர்களுக்குத் தெரிவிக்கப்படாது. வண்ணத்தால் குறிக்கப்படும் தகவல் உள்ளடக்கத்திலிருந்தே (எ.கா. புலப்படும் உரை) தெளிவாக இருப்பதை உறுதிசெய்யவும் அல்லது .sr-onlyவகுப்பில் மறைக்கப்பட்ட கூடுதல் உரை போன்ற மாற்று வழிகளில் சேர்க்கப்பட்டுள்ளது.
இணைப்பு நிறம்
.alert-linkஎந்தவொரு விழிப்பூட்டலிலும் பொருந்தக்கூடிய வண்ண இணைப்புகளை விரைவாக வழங்க பயன்பாட்டு வகுப்பைப் பயன்படுத்தவும் .
எச்சரிக்கைகள் தலைப்புகள், பத்திகள் மற்றும் வகுப்பிகள் போன்ற கூடுதல் HTML கூறுகளையும் கொண்டிருக்கலாம்.
நல்லது!
அடடா, இந்த முக்கியமான எச்சரிக்கை செய்தியை நீங்கள் வெற்றிகரமாகப் படித்தீர்கள். இந்த எடுத்துக்காட்டு உரை சிறிது நீளமாக இயங்கும், இதன் மூலம் விழிப்பூட்டலுக்குள் உள்ள இடைவெளி இந்த வகையான உள்ளடக்கத்துடன் எவ்வாறு செயல்படுகிறது என்பதை நீங்கள் பார்க்கலாம்.
உங்களுக்குத் தேவைப்படும் போதெல்லாம், விஷயங்களை அழகாகவும் நேர்த்தியாகவும் வைத்திருக்க விளிம்பு பயன்பாடுகளைப் பயன்படுத்துவதை உறுதிப்படுத்திக் கொள்ளுங்கள்.
நிராகரித்தல்
எச்சரிக்கை ஜாவாஸ்கிரிப்ட் செருகுநிரலைப் பயன்படுத்தி, எந்த எச்சரிக்கை இன்லைனையும் நிராகரிக்க முடியும். எப்படி என்பது இங்கே:
நீங்கள் விழிப்பூட்டல் செருகுநிரல் அல்லது தொகுக்கப்பட்ட பூட்ஸ்டார்ப் ஜாவாஸ்கிரிப்டை ஏற்றியுள்ளீர்கள் என்பதை உறுதிப்படுத்திக் கொள்ளுங்கள்.
நீங்கள் எங்கள் ஜாவாஸ்கிரிப்டை மூலத்திலிருந்து உருவாக்கினால், அதற்குutil.js . தொகுக்கப்பட்ட பதிப்பில் இது அடங்கும்.
டிஸ்மிஸ் பட்டன் மற்றும் கிளாஸைச் சேர்க்கவும் .alert-dismissible, இது விழிப்பூட்டலின் வலதுபுறத்தில் கூடுதல் திணிப்பைச் சேர்த்து, .closeபட்டனை நிலைநிறுத்துகிறது.
டிஸ்மிஸ் பட்டனில், data-dismiss="alert"ஜாவாஸ்கிரிப்ட் செயல்பாட்டைத் தூண்டும் பண்புக்கூறைச் சேர்க்கவும். <button>எல்லா சாதனங்களிலும் சரியான நடத்தைக்கு உறுப்பை அதனுடன் பயன்படுத்துவதை உறுதிசெய்யவும் .
விழிப்பூட்டல்களை நிராகரிக்கும்போது, அவற்றையும் வகுப்புகளையும் சேர்க்க .fadeமறக்காதீர்கள் .show.
லைவ் டெமோ மூலம் இதை செயலில் காணலாம்:
புனித குவாக்காமோல்! கீழே உள்ள துறைகளில் சிலவற்றை நீங��கள் சரிபார்க்க வேண்டும்.
ஜாவாஸ்கிரிப்ட் நடத்தை
தூண்டுகிறது
ஜாவாஸ்கிரிப்ட் மூலம் விழிப்பூட்டலை நிராகரிப்பதை இயக்கு:
அல்லது மேலே காட்டப்பட்டுள்ளபடி , விழிப்பூட்டலில் உள்ளdata பொத்தானின் பண்புகளுடன் :
எச்சரிக்கையை மூடுவது DOM இலிருந்து அகற்றப்படும் என்பதை நினைவில் கொள்ளவும்.
முறைகள்
முறை
விளக்கம்
$().alert()
data-dismiss="alert"பண்புக்கூறு கொண்ட சந்ததி கூறுகளில் கிளிக் நிகழ்வுகளுக்கு விழிப்பூட்டலைக் கேட்க வைக்கிறது. (data-api இன் தானியங்கு-தொடக்கத்தைப் பயன்படுத்தும் போது அவசியமில்லை.)
$().alert('close')
DOM இலிருந்து அகற்றுவதன் மூலம் எச்சரிக்கையை மூடுகிறது. .fadeஉறுப்பில் மற்றும் வகுப்புகள் இருந்தால், .showஅது அகற்றப்படுவதற்கு முன்பு எச்சரிக்கை மறைந்துவிடும்.
$().alert('dispose')
ஒரு உறுப்பு விழிப்பூட்டலை அழிக்கிறது.
நிகழ்வுகள்
பூட்ஸ்டார்ப்பின் விழிப்பூட்டல் செருகுநிரலானது, எச்சரிக்கை செயல்பாட்டில் இணைக்கும் சில நிகழ்வுகளை வெளிப்படுத்துகிறது.
நிகழ்வு
விளக்கம்
close.bs.alert
closeநிகழ்வு முறை என்று அழைக்கப்படும் போது இந்த நிகழ்வு உடனடியாக சுடுகிறது .
closed.bs.alert
விழிப்பூட்டல் மூடப்பட்டவுடன் இந்த நிகழ்வு நீக்கப்படும் (CSS மாற்றங்கள் முடியும் வரை காத்திருக்கும்).