Dropdowns

Bi pêveka daketinê ya Bootstrap re ji bo nîşandana navnîşên lînkan û hêj bêtir pêveberên kontekstê biguherînin.

Têgihiştinî

Dropdown ji bo xuyangkirina navnîşên lînkan û hêj bêtir veguheztin, serpêhatiyên kontekstê ne. Ew bi pêveka dakêşana JavaScript-ê ya Bootstrap-ê ve girêdayî têne çêkirin. Ew bi tikandinê têne guheztin, ne bi hejandinê; ev biryarek sêwiranê ye .

Dropdowns li ser pirtûkxaneyek partiya sêyemîn, Popper.js , têne çêkirin, ku pozîsyona dînamîkî û vedîtina dîmenderê peyda dike. Pê bawer bin ku berî JavaScript-a Bootstrap-ê popper.min.js têxinbootstrap.bundle.min.js nav xwe an jî bikar bînin / bootstrap.bundle.jsya ku Popper.js heye. Popper.js ji bo danîna dakêşanan di navbaran de nayê bikar anîn lê ji ber ku pozîsyona dînamîk ne hewce ye.

Heke hûn JavaScript-a me ji çavkaniyê ava dikin, ew hewce dikeutil.js .

Gihîştina

Standarda WAI ARIA role="menu" widgetek rastîn diyar dike , lê ev taybetî ji bo pêşekên wekî serîlêdanê yên ku kiryar an fonksiyonan didin destpêkirin e. Pêşekên ARIA tenê dikarin hêmanên menu, hêmanên menuya qutiya kontrolê, hêmanên menuya bişkojka radyoyê, komên bişkojka radyoyê û jêr-pêşekan hebin.

Ji hêla din ve, dakêşanên Bootstrap têne sêwirandin ku ji bo cûrbecûr rewş û strukturên nîşankirinê gelemperî bin û werin sepandin. Mînakî, gengaz e ku meriv pelên dakêşan biafirîne ku têketinên zêde û kontrolên formê dihewîne, wek qadên lêgerînê an formên têketinê. Ji ber vê yekê, Bootstrap ne li bendê ye (ne jî bixweber lê zêde bike) yek ji wan roleû aria-taybetmendiyên ku ji bo pêşekên ARIA -ya rastîn hewce ne. Nivîskar neçar in ku van taybetmendiyên taybetî bi xwe vekin.

Lêbelê, Bootstrap ji bo piraniya danûstendinên menuya klavyeyê yên standard piştgirîya çêkirî lê zêde dike, wek mînak şiyana ku meriv di nav .dropdown-itemhêmanên kesane de bi karanîna bişkokên pîvazê bigere û menuyê bi ESCbişkojkê bigire.

Examples

Veguheztina dakêşanê (bişkojka xwe an girêdana xwe) û menuya dakêşanê di hundurê de .dropdown, an hêmanek din a ku diyar dike, bipêçin position: relative;. Dropdown dikarin ji <a>an <button>hêmanan werin avêtin da ku çêtir hewcedariyên weyên potansiyel bicîh bînin.

Bişkojka yekane

Her yek yek .btndikare bi hin guhertinên nîşankirinê ve were veguheztinek dakêşan. Li vir çawa hûn dikarin wan bi her <button>hêmanan re bixebitin:

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown button
  </button>
  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
  </div>
</div>

Û bi <a>hêmanên:

<div class="dropdown">
  <a class="btn btn-secondary dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown link
  </a>

  <div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
  </div>
</div>

Beşa çêtirîn ev e ku hûn dikarin bi her cûrbecûr bişkojkê re jî bikin:

<!-- Example single danger button -->
<div class="btn-group">
  <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Action
  </button>
  <div class="dropdown-menu">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
    <div class="dropdown-divider"></div>
    <a class="dropdown-item" href="#">Separated link</a>
  </div>
</div>

Split button

Bi heman rengî, bişkojkên veqetandî bi hema hema bi heman nîşankirinê wekî dakêşanên yek bişkokê, lê bi lêzêdekirina ji .dropdown-toggle-splitbo cîhê rast li dora kêşeya dakêşanê biafirînin.

Em vê pola zêde bikar tînin da ku horizontî paddingli her du aliyên xêzikê% 25 kêm bikin û ya margin-leftku ji bo daxistina bişkojka birêkûpêk hatî zêdekirin jêbirin. Van guheztinên zêde hêlînê di bişkoka dabeşkirinê de navend dihêlin û li kêleka bişkoka sereke deverek lêdanek bi guncantir peyda dikin.

<!-- Example split danger button -->
<div class="btn-group">
  <button type="button" class="btn btn-danger">Action</button>
  <button type="button" class="btn btn-danger dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <div class="dropdown-menu">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
    <div class="dropdown-divider"></div>
    <a class="dropdown-item" href="#">Separated link</a>
  </div>
</div>

Mezinbûn

Daxistina bişkokan bi bişkokên her mezinahî re dixebitin, tevî bişkokên dakêşanê yên xwerû û dabeşkirî.

<!-- Large button groups (default and split) -->
<div class="btn-group">
  <button class="btn btn-secondary btn-lg dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Large button
  </button>
  <div class="dropdown-menu">
    ...
  </div>
</div>
<div class="btn-group">
  <button class="btn btn-secondary btn-lg" type="button">
    Large split button
  </button>
  <button type="button" class="btn btn-lg btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <div class="dropdown-menu">
    ...
  </div>
</div>

<!-- Small button groups (default and split) -->
<div class="btn-group">
  <button class="btn btn-secondary btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Small button
  </button>
  <div class="dropdown-menu">
    ...
  </div>
</div>
<div class="btn-group">
  <button class="btn btn-secondary btn-sm" type="button">
    Small split button
  </button>
  <button type="button" class="btn btn-sm btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <div class="dropdown-menu">
    ...
  </div>
</div>

Tarîfa bikaranînê

Dropup

.dropupBi lêzêdekirina li hêmana dêûbav pêşekên daketinê yên li jor vekin.

<!-- Default dropup button -->
<div class="btn-group dropup">
  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropup
  </button>
  <div class="dropdown-menu">
    <!-- Dropdown menu links -->
  </div>
</div>

<!-- Split dropup button -->
<div class="btn-group dropup">
  <button type="button" class="btn btn-secondary">
    Split dropup
  </button>
  <button type="button" class="btn btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <div class="dropdown-menu">
    <!-- Dropdown menu links -->
  </div>
</div>

Dropright

.droprightBi lêzêdekirina li hêmana dêûbav pêşekên dakêşanê li milê rastê hêmanan vekin.

<!-- Default dropright button -->
<div class="btn-group dropright">
  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropright
  </button>
  <div class="dropdown-menu">
    <!-- Dropdown menu links -->
  </div>
</div>

<!-- Split dropright button -->
<div class="btn-group dropright">
  <button type="button" class="btn btn-secondary">
    Split dropright
  </button>
  <button type="button" class="btn btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropright</span>
  </button>
  <div class="dropdown-menu">
    <!-- Dropdown menu links -->
  </div>
</div>

Dropleft

.dropleftBi lêzêdekirina li hêmana dêûbav pêşekên dakêşanê li milê çepê hêmanan vekin.

<!-- Default dropleft button -->
<div class="btn-group dropleft">
  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropleft
  </button>
  <div class="dropdown-menu">
    <!-- Dropdown menu links -->
  </div>
</div>

<!-- Split dropleft button -->
<div class="btn-group">
  <div class="btn-group dropleft" role="group">
    <button type="button" class="btn btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
      <span class="sr-only">Toggle Dropleft</span>
    </button>
    <div class="dropdown-menu">
      <!-- Dropdown menu links -->
    </div>
  </div>
  <button type="button" class="btn btn-secondary">
    Split dropleft
  </button>
</div>

Ji hêla dîrokî ve naveroka menuya dakêşanê pêdivî bû ku zencîre bin, lê ew êdî bi v4 re ne wusa ye. Naha hûn dikarin vebijarkî <button>li şûna s-yê hêmanan di pelikên xwe de bikar bînin <a>.

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown
  </button>
  <div class="dropdown-menu" aria-labelledby="dropdownMenu2">
    <button class="dropdown-item" type="button">Action</button>
    <button class="dropdown-item" type="button">Another action</button>
    <button class="dropdown-item" type="button">Something else here</button>
  </div>
</div>

Her weha hûn dikarin bi .dropdown-item-text. Dilxwazin ku bi CSS-ya xwerû an karûbarên nivîsê bêtir şêwaz bikin.

<div class="dropdown-menu">
  <span class="dropdown-item-text">Dropdown item text</span>
  <a class="dropdown-item" href="#">Action</a>
  <a class="dropdown-item" href="#">Another action</a>
  <a class="dropdown-item" href="#">Something else here</a>
</div>

Jîr

.activeTiştên di pelika dakêşanê de zêde bikin da ku wan wekî çalak şêwaz bikin .

<div class="dropdown-menu">
  <a class="dropdown-item" href="#">Regular link</a>
  <a class="dropdown-item active" href="#">Active link</a>
  <a class="dropdown-item" href="#">Another link</a>
</div>

Bêmecel

.disabledTiştên di pelika daketinê de lê zêde bikin da ku wan wekî neçalak şêwaz bikin .

<div class="dropdown-menu">
  <a class="dropdown-item" href="#">Regular link</a>
  <a class="dropdown-item disabled" href="#" tabindex="-1" aria-disabled="true">Disabled link</a>
  <a class="dropdown-item" href="#">Another link</a>
</div>

Ji hêla xwerû ve, pêşekek dakêşanê bixweber 100% ji jor û li milê çepê yê dêûbavê xwe tê danîn. Pêşeka daketinê .dropdown-menu-rightli a .dropdown-menuber bi rastê ve zêde bikin.

Serê xwe! Dropdowns bi saya Popper.js têne cîh kirin (ji bilî gava ku ew di navbarekê de ne).

<div class="btn-group">
  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Right-aligned menu
  </button>
  <div class="dropdown-menu dropdown-menu-right">
    <button class="dropdown-item" type="button">Action</button>
    <button class="dropdown-item" type="button">Another action</button>
    <button class="dropdown-item" type="button">Something else here</button>
  </div>
</div>

Lihevhatina bersivdar

Heke hûn dixwazin hevrêziya bersivdar bikar bînin, bi lêzêdekirina taybetmendiyê pozîsyona dînamîkî neçalak bikin data-display="static"û çînên guheztina bersivdar bikar bînin.

Ji bo ku menuya dakêşanê ya rast.dropdown-menu{-sm|-md|-lg|-xl}-right bi xala veqetandinê ya diyarkirî an mezintir hevrêz bikin, lê zêde bikin.

<div class="btn-group">
  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" data-display="static" aria-haspopup="true" aria-expanded="false">
    Left-aligned but right aligned when large screen
  </button>
  <div class="dropdown-menu dropdown-menu-lg-right">
    <button class="dropdown-item" type="button">Action</button>
    <button class="dropdown-item" type="button">Another action</button>
    <button class="dropdown-item" type="button">Something else here</button>
  </div>
</div>

Ji bo ku menuya daketinê ya çepê bi xala veqetînê ya diyarkirî an mezintir re hevrêz bikin, lê zêde bikin .dropdown-menu-rightû .dropdown-menu{-sm|-md|-lg|-xl}-left.

<div class="btn-group">
  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" data-display="static" aria-haspopup="true" aria-expanded="false">
    Right-aligned but left aligned when large screen
  </button>
  <div class="dropdown-menu dropdown-menu-right dropdown-menu-lg-left">
    <button class="dropdown-item" type="button">Action</button>
    <button class="dropdown-item" type="button">Another action</button>
    <button class="dropdown-item" type="button">Something else here</button>
  </div>
</div>

Bala xwe bidinê ku hûn ne hewce ne ku data-display="static"taybetmendiyek li bişkokên dakêşanê yên di navbaran de zêde bikin, ji ber ku Popper.js di navbaran de nayê bikar anîn.

Headers

Sernavek lê zêde bikin da ku beşên çalakiyan di her menuya dakêşanê de nîşan bikin.

<div class="dropdown-menu">
  <h6 class="dropdown-header">Dropdown header</h6>
  <a class="dropdown-item" href="#">Action</a>
  <a class="dropdown-item" href="#">Another action</a>
</div>

Dividers

Komên hêmanên menuya têkildar bi dabeşkerek veqetînin.

<div class="dropdown-menu">
  <a class="dropdown-item" href="#">Action</a>
  <a class="dropdown-item" href="#">Another action</a>
  <a class="dropdown-item" href="#">Something else here</a>
  <div class="dropdown-divider"></div>
  <a class="dropdown-item" href="#">Separated link</a>
</div>

Nivîstok

Her metnek belaş di nav pêşekek dakêşanê de bi nivîsê ve bi cîh bikin û karûbarên valakirinê bikar bînin . Bala xwe bidinê ku hûn ê muhtemelen hewceyê şêwazên mezinbûnê yên din bin da ku firehiya menuyê asteng bikin.

<div class="dropdown-menu p-4 text-muted" style="max-width: 200px;">
  <p>
    Some example text that's free-flowing within the dropdown menu.
  </p>
  <p class="mb-0">
    And this is more example text.
  </p>
</div>

Forms

Formek di nav pêşekek dakêşanê de bixin, an jî wê bikin menuyek dakêşanê, û karûbarên marjînal an peldankê bikar bînin da ku cîhê neyînî ya ku hûn hewce dikin bidin wê.

<div class="dropdown-menu">
  <form class="px-4 py-3">
    <div class="form-group">
      <label for="exampleDropdownFormEmail1">Email address</label>
      <input type="email" class="form-control" id="exampleDropdownFormEmail1" placeholder="[email protected]">
    </div>
    <div class="form-group">
      <label for="exampleDropdownFormPassword1">Password</label>
      <input type="password" class="form-control" id="exampleDropdownFormPassword1" placeholder="Password">
    </div>
    <div class="form-group">
      <div class="form-check">
        <input type="checkbox" class="form-check-input" id="dropdownCheck">
        <label class="form-check-label" for="dropdownCheck">
          Remember me
        </label>
      </div>
    </div>
    <button type="submit" class="btn btn-primary">Sign in</button>
  </form>
  <div class="dropdown-divider"></div>
  <a class="dropdown-item" href="#">New around here? Sign up</a>
  <a class="dropdown-item" href="#">Forgot password?</a>
</div>

<form class="dropdown-menu p-4">
  <div class="form-group">
    <label for="exampleDropdownFormEmail2">Email address</label>
    <input type="email" class="form-control" id="exampleDropdownFormEmail2" placeholder="[email protected]">
  </div>
  <div class="form-group">
    <label for="exampleDropdownFormPassword2">Password</label>
    <input type="password" class="form-control" id="exampleDropdownFormPassword2" placeholder="Password">
  </div>
  <div class="form-group">
    <div class="form-check">
      <input type="checkbox" class="form-check-input" id="dropdownCheck2">
      <label class="form-check-label" for="dropdownCheck2">
        Remember me
      </label>
    </div>
  </div>
  <button type="submit" class="btn btn-primary">Sign in</button>
</form>

Bikaranîn data-offsetan data-referenceji bo guheztina cîhê dakêşanê.

<div class="d-flex">
  <div class="dropdown mr-1">
    <button type="button" class="btn btn-secondary dropdown-toggle" id="dropdownMenuOffset" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-offset="10,20">
      Offset
    </button>
    <div class="dropdown-menu" aria-labelledby="dropdownMenuOffset">
      <a class="dropdown-item" href="#">Action</a>
      <a class="dropdown-item" href="#">Another action</a>
      <a class="dropdown-item" href="#">Something else here</a>
    </div>
  </div>
  <div class="btn-group">
    <button type="button" class="btn btn-secondary">Reference</button>
    <button type="button" class="btn btn-secondary dropdown-toggle dropdown-toggle-split" id="dropdownMenuReference" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-reference="parent">
      <span class="sr-only">Toggle Dropdown</span>
    </button>
    <div class="dropdown-menu" aria-labelledby="dropdownMenuReference">
      <a class="dropdown-item" href="#">Action</a>
      <a class="dropdown-item" href="#">Another action</a>
      <a class="dropdown-item" href="#">Something else here</a>
      <div class="dropdown-divider"></div>
      <a class="dropdown-item" href="#">Separated link</a>
    </div>
  </div>
</div>

Bikaranîna

Bi riya taybetmendiyên daneyê an JavaScriptê, pêveka dakêşanê naveroka veşartî (menekên daketî) bi guheztina .showpola li ser xala navnîşa dêûbav diguhezîne. Taybetmendî data-toggle="dropdown"ji bo girtina pêşekên dakêşanê di astek serîlêdanê de pê ve girêdayî ye, ji ber vê yekê ramanek baş e ku hûn her gav wê bikar bînin.

Li ser cîhazên pêça-çalakkirî, vekirina peldankek hilgirên vala ( $.noop) mouseoverli zarokên tavilê yên <body>hêmanê zêde dike. Ev hacka bêkêmasî ya nebaş pêdivî ye ku meriv di delegasyona bûyera iOS-ê de li dor xeletiyek bixebite , ku wekî din rê li ber tepek li cîhek derveyî dakêşanê bigire ku koda ku dakêşanê digire dest pê bike. Dema ku dakêşandin girtî be, ev mouseoverrêkarên vala yên zêde têne rakirin.

Bi taybetmendiyên daneyê

Ji data-toggle="dropdown"bo guheztina peldankekê li lînkek an bişkokek zêde bikin.

<div class="dropdown">
  <button id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown trigger
  </button>
  <div class="dropdown-menu" aria-labelledby="dLabel">
    ...
  </div>
</div>

Bi JavaScript

Bi navgîniya JavaScript-ê ve bang bikin:

$('.dropdown-toggle').dropdown()

`data-toggle="dropdown"`hîn jî pêwîst e

Her çiqas hûn bi JavaScript-ê ve gazî daketina xwe bikin an li şûna data-api-ê bikar bînin, data-toggle="dropdown"pêdivî ye ku her gav li ser hêmana dakêşanê hebe.

Vebijêrk

Vebijark dikarin bi taybetmendiyên daneyan an JavaScriptê ve werin derbas kirin. Ji bo taybetmendiyên daneyê, navê vebijarkê lê zêde bikin data-, wekî di data-offset="".

Nav	Awa	Destçûnî	Terîf
offset	hejmar \| string \| karî	0	Berhevkirina dakêşanê li gorî armanca xwe. Dema ku fonksiyonek ji bo destnîşankirina guheztinê tê bikar anîn, ew wekî argumana wê ya yekem bi objeyek ku daneya offset vedihewîne tê gotin. Pêdivî ye ku fonksiyonek bi heman avahiyê vegerîne. Hêmana destkêşanê ya DOM-ê wekî argumana duyemîn derbas dibe. Ji bo bêtir agahdarî serî li belgeyên offset yên Popper.js bidin .
flip	boolean	rast	Destûrê bide Dropdown ku di bûyera ku li ser hêmana referansê li hev biqelişe. Ji bo bêtir agahdarî serî li belgeyên flip ên Popper.js bidin .
tixûb	string \| pêve	'scrollParent'	Sînorê astengiya zêde ya pêşeka daketî. Nirxên `'viewport'`, `'window'`, `'scrollParent'`, an referansek HTMLElement (tenê JavaScript) qebûl dike. Ji bo bêtir agahdarî serî li belgeyên preventOverflow ya Popper.js bidin .
balkêşî	string \| pêve	'veguhertin'	Hêmana referansê ya menuya dakêşanê. Nirxên `'toggle'`, `'parent'`, an referansek HTMLElement qebûl dike. Ji bo bêtir agahdarî serî li Popper.js's referenceObject docs .
pêşkêşî	ben	'dînamîk'	Bi xwerû, em Popper.js ji bo pozîsyona dînamîkî bikar tînin. Vê bi neçalak bike `static`.
popperConfig	null \| tişt	null	Ji bo guherandina veavakirina Popper.js ya xwerû ya Bootstrap, li veavakirina Popper.js binêre.

Note when boundary is set to any value other than 'scrollParent', the style position: static is applied to the .dropdown container.

Methods

Method	Description
`$().dropdown('toggle')`	Toggles the dropdown menu of a given navbar or tabbed navigation.
`$().dropdown('show')`	Shows the dropdown menu of a given navbar or tabbed navigation.
`$().dropdown('hide')`	Hides the dropdown menu of a given navbar or tabbed navigation.
`$().dropdown('update')`	Updates the position of an element’s dropdown.
`$().dropdown('dispose')`	Destroys an element’s dropdown.

Events

All dropdown events are fired at the .dropdown-menu’s parent element and have a relatedTarget property, whose value is the toggling anchor element. hide.bs.dropdown and hidden.bs.dropdown events have a clickEvent property (only when the original event type is click) that contains an Event Object for the click event.

Event	Description
`show.bs.dropdown`	This event fires immediately when the show instance method is called.
`shown.bs.dropdown`	Dema ku dakêşana ji bikarhênerê re xuya bibe (dê li benda veguheztinên CSS-ê bisekine, biqede), ev bûyer tê şewitandin.
`hide.bs.dropdown`	Dema ku rêbaza mînaka veşartinê hate gazî kirin, ev bûyer tavilê tê şewitandin.
`hidden.bs.dropdown`	Ev bûyer dema ku dakêşana ku ji bikarhênerê veşartî xilas bû (dê li benda veguheztinên CSS-ê bisekine, biqede) tê şewitandin.

$('#myDropdown').on('show.bs.dropdown', function () {
  // do something...
})

Dropdowns

Têgihiştinî

Gihîştina

Examples

Bişkojka yekane

Split button

Mezinbûn

Tarîfa bikaranînê

Dropup

Dropright

Dropleft

Tiştên menu

Jîr

Bêmecel

Alignment menu

Lihevhatina bersivdar

Naveroka menu

Headers

Dividers

Nivîstok

Forms

Bikaranîna

Bi taybetmendiyên daneyê

Bi JavaScript

`data-toggle="dropdown"`hîn jî pêwîst e

Vebijêrk

Methods

Events

Dropdowns

Têgihiştinî

Gihîştina

Examples

Bişkojka yekane

Split button

Mezinbûn

Tarîfa bikaranînê

Dropup

Dropright

Dropleft

Tiştên menu

Jîr

Bêmecel

Alignment menu

Lihevhatina bersivdar

Naveroka menu

Headers

Sernavê dakêşanê

Dividers

Nivîstok

Forms

Vebijarkên Dropdown

Bikaranîna

Bi taybetmendiyên daneyê

Bi JavaScript

data-toggle="dropdown"hîn jî pêwîst e

Vebijêrk

Methods

Events

`data-toggle="dropdown"`hîn jî pêwîst e