in English

Popovers

உங்கள் தளத்தில் உள்ள எந்த உறுப்புக்கும் iOS இல் உள்ளதைப் போன்ற பூட்ஸ்டார்ப் பாப்ஓவர்களைச் சேர்ப்பதற்கான ஆவணங்கள் மற்றும் எடுத்துக்காட்டுகள்.

கண்ணோட்டம்

பாப்ஓவர் செருகுநிரலைப் பயன்படுத்தும் போது தெரிந்து கொள்ள வேண்டியவை:

  • Popovers 3வது தரப்பு லைப்ரரியான Popper ஐ பொசிஷனிங் செய்ய நம்பியுள்ளது . நீங்கள் bootstrap.js க்கு முன் popper.min.js ஐ சேர்க்க வேண்டும் அல்லது popovers வேலை செய்ய பாப்பரைக் கொண்டிருக்கும் bootstrap.bundle.min.js/ பயன்படுத்தவும்!bootstrap.bundle.js
  • Popovers டூல்டிப் சொருகி ஒரு சார்புநிலையாக தேவைப்படுகிறது.
  • நீங்கள் எங்கள் ஜாவாஸ்கிரிப்டை மூலத்திலிருந்து உருவாக்கினால், அதற்குutil.js .
  • செயல்திறன் காரணங்களுக்காக Popovers தேர்வு செய்யப்படுகின்றன, எனவே அவற்றை நீங்களே துவக்க வேண்டும் .
  • பூஜ்ஜிய நீளம் titleமற்றும் contentமதிப்புகள் ஒருபோதும் பாப்ஓவரைக் காட்டாது.
  • மிகவும் சிக்கலான கூறுகளில் (எங்கள் உள்ளீட்டு குழுக்கள், பொத்தான் குழுக்கள் போன்றவை) ரெண்டரிங் container: 'body'சிக்கல்களைத் தவிர்க்க குறிப்பிடவும்.
  • மறைக்கப்பட்ட கூறுகளில் பாப்ஓவர்களைத் தூண்டுவது வேலை செய்யாது.
  • ஒரு ரேப்பர் உறுப்பில் பாபோவர்ஸ் .disabledஅல்லது disabledஉறுப்புகள் தூண்டப்பட வேண்டும்.
  • பல கோடுகளில் மூடப்பட்டிருக்கும் ஆங்கர்களில் இருந்து தூண்டப்படும் போது, ​​பாப்ஓவர்கள் ஆங்கர்களின் ஒட்டுமொத்த அகலத்திற்கு இடையே மையப்படுத்தப்படும். இந்த நடத்தையைத் தவிர்க்க .text-nowrapஉங்கள் மீது பயன்படுத்தவும் .<a>
  • DOM இலிருந்து தொடர்புடைய உறுப்புகள் அகற்றப்படுவதற்கு முன், Popovers மறைக்கப்பட வேண்டும்.
  • நிழல் DOM இல் உள்ள ஒரு உறுப்புக்கு நன்றி செலுத்துவதன் மூலம் Popovers தூண்டப்படலாம்.
இயல்பாக, இந்தக் கூறு உள்ளமைக்கப்பட்ட உள்ளடக்க சுத்திகரிப்பாளரைப் பயன்படுத்துகிறது, இது வெளிப்படையாக அனுமதிக்கப்படாத எந்த HTML உறுப்புகளையும் அகற்றும். மேலும் விவரங்களுக்கு எங்கள் ஜாவாஸ்கிரிப்ட் ஆவணத்தில் உள்ள சானிடைசர் பகுதியைப் பார்க்கவும் .
இந்தக் கூறுகளின் அனிமேஷன் விளைவு prefers-reduced-motionமீடியா வினவலைச் சார்ந்தது. எங்கள் அணுகல்தன்மை ஆவணத்தின் குறைக்கப்பட்ட இயக்கம் பகுதியைப் பார்க்கவும் .

சில எடுத்துக்காட்டுகளுடன் popovers எவ்வாறு செயல்படுகிறது என்பதைப் பார்க்க தொடர்ந்து படியுங்கள்.

எடுத்துக்காட்டு: எல்லா இடங்களிலும் பாப்ஓவர்களை இயக்கு

data-toggleஒரு பக்கத்தில் அனைத்து பாபோவர்களையும் துவக்குவதற்கான ஒரு வழி, அவற்றின் பண்புக்கூறு மூலம் அவற்றைத் தேர்ந்தெடுப்பதாகும் :

$(function () {
  $('[data-toggle="popover"]').popover()
})

எடுத்துக்காட்டு: containerவிருப்பத்தைப் பயன்படுத்துதல்

பாப்ஓவரில் குறுக்கிடும் ஒரு பெற்றோர் உறுப்பில் சில ஸ்டைல்கள் இருந்தால், containerஅதற்குப் பதிலாக அந்த உறுப்பில் பாப்ஓவரின் HTML தோன்றும் வகையில் தனிப்பயன் ஒன்றைக் குறிப்பிட வேண்டும்.

$(function () {
  $('.example-popover').popover({
    container: 'body'
  })
})

உதாரணமாக

<button type="button" class="btn btn-lg btn-danger" data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?">Click to toggle popover</button>

நான்கு திசைகள்

நான்கு விருப்பங்கள் உள்ளன: மேல், வலது, கீழ் மற்றும் இடது சீரமைக்கப்பட்டது.

<button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="top" data-content="Top popover">
  Popover on top
</button>
<button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="right" data-content="Right popover">
  Popover on right
</button>
<button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Bottom popover">
  Popover on bottom
</button>
<button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="left" data-content="Left popover">
  Popover on left
</button>

அடுத்த கிளிக்கில் நிராகரிக்கவும்

focusமாற்று உறுப்பைக் காட்டிலும் வேறொரு உறுப்பின் பயனரின் அடுத்த கிளிக்கில் பாப்ஓவர்களை நிராகரிக்க தூண்டுதலைப் பயன்படுத்தவும் .

அடுத்த கிளிக்கில் நிராகரிக்க குறிப்பிட்ட மார்க்அப் தேவை

சரியான குறுக்கு-உலாவி மற்றும் குறுக்கு-தளம் நடத்தைக்கு, நீங்கள் குறிச்சொல்லைப் பயன்படுத்த வேண்டும், <a>குறிச்சொல்லை அல்ல , <button>மேலும் நீங்கள் ஒரு tabindexபண்புக்கூறையும் சேர்க்க வேண்டும்.

<a tabindex="0" class="btn btn-lg btn-danger" role="button" data-toggle="popover" data-trigger="focus" title="Dismissible popover" data-content="And here's some amazing content. It's very engaging. Right?">Dismissible popover</a>
$('.popover-dismiss').popover({
  trigger: 'focus'
})

முடக்கப்பட்ட கூறுகள்

பண்புக்கூறுடன் கூடிய கூறுகள் disabledஊடாடக்கூடியவை அல்ல, அதாவது பாப்ஓவரை (அல்லது டூல்டிப்) தூண்டுவதற்கு பயனர்கள் அவற்றை நகர்த்தவோ அல்லது கிளிக் செய்யவோ முடியாது. ஒரு தீர்வாக, நீங்கள் ஒரு ரேப்பரிலிருந்து பாப்ஓவரைத் தூண்ட வேண்டும் <div>அல்லது முடக்கப்பட்ட உறுப்பை <span>மேலெழுத வேண்டும் pointer-events.

முடக்கப்பட்ட பாப்ஓவர் தூண்டுதல்களுக்கு, data-trigger="hover"உங்கள் பயனர்கள் முடக்கப்பட்ட உறுப்பைக் கிளிக் செய்ய எதிர்பார்க்காததால், பாப்ஓவர் உடனடி காட்சிப் பின்னூட்டமாகத் தோன்றும்.

<span class="d-inline-block" data-toggle="popover" data-content="Disabled popover">
  <button class="btn btn-primary" style="pointer-events: none;" type="button" disabled>Disabled button</button>
</span>

பயன்பாடு

ஜாவாஸ்கிரிப்ட் வழியாக பாப்ஓவர்களை இயக்கவும்:

$('#example').popover(options)
GPU முடுக்கம்

GPU முடுக்கம் மற்றும் மாற்றியமைக்கப்பட்ட சிஸ்டம் DPI காரணமாக Windows 10 சாதனங்களில் Popovers சில நேரங்களில் மங்கலாகத் தோன்றும். v4 இல் இதற்கான தீர்வு, உங்கள் பாப்ஓவர்களில் தேவைக்கேற்ப GPU முடுக்கத்தை முடக்குவதாகும்.

பரிந்துரைக்கப்படும் திருத்தம்:

Popper.Defaults.modifiers.computeStyle.gpuAcceleration = !(window.devicePixelRatio < 1.5 && /Win/.test(navigator.platform))

விசைப்பலகை மற்றும் உதவி தொழில்நுட்ப பயனர்களுக்கு popovers வேலை செய்யும்

விசைப்பலகை பயனர்கள் உங்கள் பாப்ஓவர்களைச் செயல்படுத்த அனுமதிக்க, பாரம்பரியமாக கீபோர்டு-ஃபோகஸ் செய்யக்கூடிய மற்றும் ஊடாடும் (இணைப்புகள் அல்லது படிவக் கட்டுப்பாடுகள் போன்றவை) HTML உறுப்புகளில் மட்டுமே அவற்றைச் சேர்க்க வேண்டும். பண்புக்கூறைச் சேர்ப்பதன் மூலம் தன்னிச்சையான HTML உறுப்புகள் ( <span>கள் போன்றவை) கவனம் செலுத்த முடியும் என்றாலும், இது விசைப்பலகை பயனர்களுக்கு ஊடாடாத கூறுகளில் tabindex="0"எரிச்சலூட்டும் மற்றும் குழப்பமான தாவல் நிறுத்தங்களைச் சேர்க்கும், மேலும் பெரும்பாலான உதவித் தொழில்நுட்பங்கள் தற்போது பாப்ஓவரின் உள்ளடக்கத்தை அறிவிக்கவில்லை. . கூடுதலாக, உங்கள் பாப்ஓவர்களுக்கான தூண்டுதலாக மட்டுமே நம்ப வேண்டாம் hover, ஏனெனில் இது விசைப்பலகை பயனர்களைத் தூண்டுவதை சாத்தியமற்றதாக்கும்.

இந்த விருப்பத்தின் மூலம் நீங்கள் பணக்கார, கட்டமைக்கப்பட்ட HTML ஐ பாப்ஓவர்களில் செருக முடியும் என்றாலும், htmlஅதிகப்படியான உள்ளடக்கத்தைச் சேர்ப்பதைத் தவிர்க்குமாறு நாங்கள் கடுமையாக பரிந்துரைக்கிறோம். popovers தற்போது செயல்படும் விதம் என்னவென்றால், ஒருமுறை காட்டப்பட்டால், அவற்றின் உள்ளடக்கம் aria-describedbyபண்புக்கூறுடன் தூண்டுதல் உறுப்புடன் இணைக்கப்பட்டுள்ளது. இதன் விளைவாக, பாப்ஓவரின் முழு உள்ளடக்கமும் ஒரு நீண்ட, தடையற்ற ஸ்ட்ரீமாக உதவி தொழில்நுட்ப பயனர்களுக்கு அறிவிக்கப்படும்.

கூடுதலாக, உங்கள் பாப்ஓவரில் ஊடாடும் கட்டுப்பாடுகளையும் (படிவ உறுப்புகள் அல்லது இணைப்புகள் போன்றவை) சேர்க்க முடியும் (இந்த உறுப்புகளை whiteListஅல்லது அனுமதிக்கப்பட்ட பண்புக்கூறுகள் மற்றும் குறிச்சொற்களில் சேர்ப்பதன் மூலம்), தற்போது பாப்ஓவர் விசைப்பலகை ஃபோகஸ் ஆர்டரை நிர்வகிக்கவில்லை என்பதை அறிந்து கொள்ளுங்கள். விசைப்பலகை பயனர் ஒரு பாப்ஓவரைத் திறக்கும்போது, ​​தூண்டுதல் உறுப்பு மீது கவனம் செலுத்தப்படும், மேலும் ஆவணத்தின் கட்டமைப்பில் உள்ள தூண்டுதலைப் பொதுவாக பாப்ஓவர் உடனடியாகப் பின்பற்றாததால், முன்னோக்கி நகர்கிறது/அழுத்துகிறது என்பதற்கு எந்த உத்தரவாதமும் இல்லை.TABவிசைப்பலகை பயனரை பாப்ஓவரிலேயே நகர்த்தும். சுருக்கமாக, பாப்ஓவரில் ஊடாடும் கட்டுப்பாடுகளைச் சேர்ப்பது, விசைப்பலகை பயனர்களுக்கும் உதவித் தொழில்நுட்பங்களைப் பயன்படுத்துபவர்களுக்கும் இந்தக் கட்டுப்பாடுகளை அணுக முடியாத/பயன்படுத்த முடியாததாக மாற்றும் அல்லது குறைந்தபட்சம் ஒரு நியாயமற்ற ஒட்டுமொத்த ஃபோகஸ் ஆர்டரை உருவாக்கலாம். இந்த சந்தர்ப்பங்களில், அதற்குப் பதிலாக மாதிரி உரையாடலைப் பயன்படுத்தவும்.

விருப்பங்கள்

தரவு பண்புக்கூறுகள் அல்லது ஜாவாஸ்கிரிப்ட் மூலம் விருப்பங்களை அனுப்பலாம். data-தரவு பண்புக்கூறுகளுக்கு, இல் உள்ளதைப் போல விருப்பப் பெயரைச் சேர்க்கவும் data-animation="".

பாதுகாப்பு காரணங்களுக்காக தரவு பண்புக்கூறுகளைப் பயன்படுத்தி sanitize, sanitizeFnமற்றும் whiteListவிருப்பங்களை வழங்க முடியாது என்பதை நினைவில் கொள்ளவும்.
பெயர் வகை இயல்புநிலை விளக்கம்
இயங்குபடம் பூலியன் உண்மை பாப்ஓவருக்கு CSS ஃபேட் மாற்றத்தைப் பயன்படுத்தவும்
கொள்கலன் சரம் | உறுப்பு | பொய் பொய்

ஒரு குறிப்பிட்ட உறுப்புடன் பாப்ஓவரைச் சேர்க்கிறது. உதாரணம்: container: 'body'. இந்த விருப்பம் குறிப்பாக பயனுள்ளதாக இருக்கும், இது ஆவணத்தின் ஓட்டத்தில் தூண்டுதல் உறுப்புக்கு அருகில் பாப்ஓவரை நிலைநிறுத்த உங்களை அனுமதிக்கிறது - இது சாளரத்தின் அளவை மாற்றும் போது தூண்டும் உறுப்பிலிருந்து பாப்ஓவர் மிதப்பதைத் தடுக்கும்.

உள்ளடக்கம் சரம் | உறுப்பு | செயல்பாடு ''

data-contentபண்புக்கூறு இல்லை என்றால் இயல்புநிலை உள்ளடக்க மதிப்பு .

ஒரு செயல்பாடு கொடுக்கப்பட்டால், அது thisபாப்ஓவர் இணைக்கப்பட்டுள்ள உறுப்புடன் அதன் குறிப்புடன் அழைக்கப்படும்.

தாமதம் எண் | பொருள் 0

பாப்ஓவரை (எம்எஸ்) காட்டுவது மற்றும் மறைப்பது தாமதம் - கைமுறை தூண்டுதல் வகைக்கு பொருந்தாது

எண் வழங்கப்பட்டால், மறை/காட்சி இரண்டிற்கும் தாமதம் பயன்படுத்தப்படும்

பொருளின் அமைப்பு:delay: { "show": 500, "hide": 100 }

html பூலியன் பொய் பாப்ஓவரில் HTML ஐச் செருகவும். textதவறு எனில் , DOM இல் உள்ளடக்கத்தைச் செருக jQuery இன் முறை பயன்படுத்தப்படும். XSS தாக்குதல்களைப் பற்றி நீங்கள் கவலைப்படுகிறீர்கள் என்றால் உரையைப் பயன்படுத்தவும்.
வேலை வாய்ப்பு சரம் | செயல்பாடு 'சரி'

பாப்ஓவரை நிலைநிறுத்துவது எப்படி - ஆட்டோ | மேல் | கீழே | விட்டு | சரி.
குறிப்பிடப்பட்டால், அது பாப்ஓவரை autoமாறும் வகையில் மாற்றியமைக்கும்.

இடத்தைத் தீர்மானிக்க ஒரு செயல்பாடு பயன்படுத்தப்படும்போது, ​​அது பாப்ஓவர் DOM முனை அதன் முதல் வாதமாகவும், தூண்டுதல் உறுப்பு DOM முனை அதன் இரண்டாவது எனவும் அழைக்கப்படுகிறது. சூழல் பாப்ஓவர் நிகழ்வாக thisஅமைக்கப்பட்டுள்ளது.

தேர்வாளர் சரம் | பொய் பொய் தேர்வாளர் வழங்கப்பட்டால், குறிப்பிட்ட இலக்குகளுக்கு பாப்ஓவர் பொருள்கள் ஒப்படைக்கப்படும். நடைமுறையில், டைனமிக் HTML உள்ளடக்கத்தை பாப்ஓவர் சேர்க்க இது பயன்படுத்தப்படுகிறது. இதையும் ஒரு தகவல் உதாரணத்தையும் பார்க்கவும் .
டெம்ப்ளேட் லேசான கயிறு '<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-header"></h3><div class="popover-body"></div></div>'

பாப்ஓவரை உருவாக்கும் போது பயன்படுத்த அடிப்படை HTML.

பாப்ஓவரில் titleஊசி செலுத்தப்படும் .popover-header.

பாப்ஓவரில் contentஊசி செலுத்தப்படும் .popover-body.

.arrowபாபோவரின் அம்பாக மாறும்.

வெளிப்புற ரேப்பர் உறுப்பு வகுப்பைக் கொண்டிருக்க வேண்டும் .popover.

தலைப்பு சரம் | உறுப்பு | செயல்பாடு ''

titleபண்புக்கூறு இல்லாவிட்டால் இயல்புநிலை தலைப்பு மதிப்பு .

ஒரு செயல்பாடு கொடுக்கப்பட்டால், அது thisபாப்ஓவர் இணைக்கப்பட்டுள்ள உறுப்புடன் அதன் குறிப்புடன் அழைக்கப்படும்.

தூண்டுதல் லேசான கயிறு 'கிளிக்' பாப்ஓவர் எவ்வாறு தூண்டப்படுகிறது - கிளிக் | மிதவை | கவனம் | கையேடு. நீங்கள் பல தூண்டுதல்களை அனுப்பலாம்; அவற்றை ஒரு இடைவெளியுடன் பிரிக்கவும். manualவேறு எந்த தூண்டுதலுடனும் இணைக்க முடியாது.
ஆஃப்செட் எண் | லேசான கயிறு 0 அதன் இலக்குடன் தொடர்புடைய பாப்ஓவரின் ஈடுசெய்யப்பட்டது. மேலும் தகவலுக்கு, பாப்பரின் ஆஃப்செட் டாக்ஸைப் பார்க்கவும் .
வீழ்ச்சியடைதல் சரம் | வரிசை 'புரட்டு' ஃபால்பேக்கில் பாப்பர் எந்த நிலையைப் பயன்படுத்துவார் என்பதைக் குறிப்பிட அனுமதிக்கவும். மேலும் தகவலுக்கு, பாப்பரின் நடத்தை ஆவணங்களைப் பார்க்கவும்
விருப்ப வகுப்பு சரம் | செயல்பாடு ''

பாப்ஓவர் காட்டப்படும்போது வகுப்புகளைச் சேர்க்கவும். டெம்ப்ளேட்டில் குறிப்பிடப்பட்டுள்ள எந்த வகுப்புகளுக்கும் கூடுதலாக இந்த வகுப்புகள் சேர்க்கப்படும் என்பதை நினைவில் கொள்ளவும். பல வகுப்புகளைச் சேர்க்க, அவற்றை இடைவெளிகளுடன் பிரிக்கவும்: 'a b'.

கூடுதல் வகுப்புப் பெயர்களைக் கொண்ட ஒற்றை சரத்தை வழங்கும் செயல்பாட்டையும் நீங்கள் அனுப்பலாம்.

எல்லை சரம் | உறுப்பு 'சுருள் பெற்றோர்' பாப்ஓவரின் ஓவர்ஃப்ளோ கட்டுப்பாடு எல்லை. 'viewport', 'window', 'scrollParent', அல்லது HTMLElement குறிப்பு (JavaScript மட்டும்) இன் மதிப்புகளை ஏற்கிறது . மேலும் தகவலுக்கு, Popper's preventOverflow ஆவணத்தைப் பார்க்கவும் .
சுத்தப்படுத்து பூலியன் உண்மை சுத்தப்படுத்துதலை இயக்கவும் அல்லது முடக்கவும். செயல்படுத்தப்பட்டால் 'template', 'content'மற்றும் 'title'விருப்பங்கள் சுத்தப்படுத்தப்படும். எங்கள் ஜாவாஸ்கிரிப்ட் ஆவணத்தில் சானிடைசர் பகுதியைப் பார்க்கவும் .
வெள்ளைப்பட்டியல் பொருள் இயல்புநிலை மதிப்பு அனுமதிக்கப்பட்ட பண்புக்கூறுகள் மற்றும் குறிச்சொற்களைக் கொண்ட பொருள்
சுத்திகரிப்பு பூஜ்ய | செயல்பாடு ஏதுமில்லை இங்கே நீங்கள் உங்கள் சொந்த சுத்திகரிப்பு செயல்பாட்டை வழங்கலாம். சுத்திகரிப்பு செய்ய பிரத்யேக நூலகத்தைப் பயன்படுத்த விரும்பினால் இது பயனுள்ளதாக இருக்கும்.
popperConfig பூஜ்ய | பொருள் ஏதுமில்லை பூட்ஸ்டார்ப்பின் இயல்புநிலை பாப்பர் கட்டமைப்பை மாற்ற, பாப்பரின் உள்ளமைவைப் பார்க்கவும்

தனிப்பட்ட பாபோவர்களுக்கான தரவு பண்புக்கூறுகள்

மேலே விவரிக்கப்பட்டுள்ளபடி, தனிப்பட்ட பாப்ஓவர்களுக்கான விருப்பங்களை தரவு பண்புக்கூறுகளின் மூலம் மாற்றாகக் குறிப்பிடலாம்.

முறைகள்

ஒத்திசைவற்ற முறைகள் மற்றும் மாற்றங்கள்

அனைத்து API முறைகளும் ஒத்திசைவற்றவை மற்றும் மாற்றத்தைத் தொடங்குகின்றன . மாற்றம் தொடங்கப்பட்டவுடன், ஆனால் அது முடிவதற்குள் அவர்கள் அழைப்பாளரிடம் திரும்புகிறார்கள் . கூடுதலாக, மாற்றும் கூறுகளின் முறை அழைப்பு புறக்கணிக்கப்படும் .

மேலும் தகவலுக்கு எங்கள் ஜாவாஸ்கிரிப்ட் ஆவணங்களைப் பார்க்கவும் .

$().popover(options)

உறுப்பு சேகரிப்புக்கான பாப்ஓவர்களைத் துவக்குகிறது.

.popover('show')

ஒரு தனிமத்தின் பாப்ஓவரை வெளிப்படுத்துகிறது. பாப்ஓவர் உண்மையில் காட்டப்படுவதற்கு முன்பு (அதாவது shown.bs.popoverநிகழ்வு நிகழும் முன்) அழைப்பாளருக்குத் திரும்புகிறது. இது பாப்ஓவரின் "கையேடு" தூண்டுதலாகக் கருதப்படுகிறது. தலைப்பு மற்றும் உள்ளடக்கம் பூஜ்ஜிய நீளம் கொண்ட Popovers ஒருபோதும் காட்டப்படாது.

$('#element').popover('show')

.popover('hide')

ஒரு தனிமத்தின் பாப்ஓவரை மறைக்கிறது. பாப்ஓவர் உண்மையில் மறைக்கப்படுவதற்கு முன்பு (அதாவது hidden.bs.popoverநிகழ்வு நிகழும் முன்) அழைப்பாளருக்குத் திரும்புகிறது. இது பாப்ஓவரின் "கையேடு" தூண்டுதலாகக் கருதப்படுகிறது.

$('#element').popover('hide')

.popover('toggle')

உறுப்புகளின் பாப்ஓவரை மாற்றுகிறது. பாப்ஓவர் உண்மையில் காட்டப்படுவதற்கு அல்லது மறைக்கப்படுவதற்கு முன்பு (அதாவது நிகழ்வு shown.bs.popoverஅல்லது hidden.bs.popoverநிகழ்வு நிகழும் முன்) அழைப்பாளருக்குத் திரும்புகிறது. இது பாப்ஓவரின் "கையேடு" தூண்டுதலாகக் கருதப்படுகிறது.

$('#element').popover('toggle')

.popover('dispose')

ஒரு தனிமத்தின் பாப்ஓவரை மறைத்து அழிக்கிறது. பிரதிநிதித்துவத்தைப் பயன்படுத்தும் Popovers ( selectorவிருப்பத்தைப் பயன்படுத்தி உருவாக்கப்பட்டவை ) சந்ததி தூண்டுதல் கூறுகளில் தனித்தனியாக அழிக்கப்பட முடியாது.

$('#element').popover('dispose')

.popover('enable')

ஒரு தனிமத்தின் பாப்ஓவர் காட்டப்படும் திறனை வழங்குகிறது. Popovers இயல்பாகவே இயக்கப்படும்.

$('#element').popover('enable')

.popover('disable')

ஒரு உறுப்பின் பாப்ஓவர் காட்டப்படுவதற்கான திறனை நீக்குகிறது. பாப்ஓவர் மீண்டும் இயக்கப்பட்டால் மட்டுமே அதைக் காட்ட முடியும்.

$('#element').popover('disable')

.popover('toggleEnabled')

ஒரு உறுப்பின் பாப்ஓவர் காட்டப்படும் அல்லது மறைக்கப்படுவதற்கான திறனை மாற்றுகிறது.

$('#element').popover('toggleEnabled')

.popover('update')

உறுப்பின் பாப்ஓவரின் நிலையைப் புதுப்பிக்கிறது.

$('#element').popover('update')

நிகழ்வுகள்

நிகழ்வு வகை விளக்கம்
show.bs.popover showநிகழ்வு முறை என்று அழைக்கப்படும் போது இந்த நிகழ்வு உடனடியாக சுடுகிறது .
காட்டப்பட்டுள்ளது.bs.popover பாப்ஓவர் பயனருக்குத் தெரியும் போது இந்த நிகழ்வு நீக்கப்படும் (CSS மாற்றங்கள் முடிவடையும் வரை காத்திருக்கும்).
hide.bs.popover hideநிகழ்வு முறை அழைக்கப்பட்டவுடன் இந்த நிகழ்வு உடனடியாக நீக்கப்படும் .
மறைக்கப்பட்ட.bs.popover பாப்ஓவர் பயனரிடமிருந்து மறைக்கப்பட்டு முடி���்ததும் இந்த நிகழ்வு நீக்கப்படும் (CSS மாற்றங்கள் முடிவடையும் வரை காத்திருக்கும்).
செருகப்பட்டது.bs.popover show.bs.popoverDOM இல் பாப்ஓவர் டெம்ப்ளேட் சேர்க்கப்படும் போது, ​​நிகழ்வுக்குப் பிறகு இந்த நிகழ்வு நீக்கப்படும் .
$('#myPopover').on('hidden.bs.popover', function () {
  // do something...
})