Ceci est mon code bootstrap.

<label>Select Leave Type</label>
<div class="dropdown">
    <i class="dropdown-arrow dropdown-arrow-inverse"></i>
    <button class="btn btn4 btn-default dropdown-toggle" type="button" id="menu0" data-toggle="dropdown">--Select--
    <span class="caret"></span></button>
    <ul class="dropdown-menu  dropdown-inverse0" role="menu" aria-labelledby="menu0" id="drp0">
        <li role="presentation"><a data-myAttribute0="casual" class="list0" href="#" >Casual Leave</a></li>
        <li role="presentation"><a data-myAttribute0="annual" class="list0" href="#" >Annual Leave</a></li>
        <li role="presentation"><a data-myAttribute0="medical" class="list0" href="#" >Medical Leave</a></li>
    </ul>
</div>

C'est le code que j'utilise habituellement pour masquer la liste déroulante entière.

$('.btn4').css('visibility', 'hidden');

Mais pour le moment, je veux cacher un élément. Je ne peux pas comprendre ça. Aidez-moi, s'il vous plaît. Je vous remercie.

MODIFIER 1 Quand j'utilise

       <script>
        $('document').ready(function () {
           $('#drp0 li').eq(1).css('visibility', 'hidden');

        });</script>


Ça arrive. entrez la description de l'image ici


Comme vous pouvez le comprendre, ce n'est pas ce dont j'ai besoin.Veuillez me donner plus de suggestions

-1
Dil. 21 juil. 2015 à 12:11

4 réponses

Meilleure réponse

Pour utiliser absolument la solution Bootstrap, vous pouvez ajouter la classe hide à l'élément que vous souhaitez masquer. Par exemple:

<li role="presentation"><a data-myAttribute0="annual" class="list0 hide" href="#" >Annual Leave</a></li>

Voici un exemple sur BootPly: http://www.bootply.com/q7gTTiFzOT

Si vous voulez que cela soit fait dynamiquement en utilisant jQuery, vous pouvez essayer ceci:

$('ul > li:eq(1)').addClass('hide');
1
WhiteAngel 21 juil. 2015 à 09:43

Sélectionnez les éléments li à l'intérieur drp0 (qui est l'ID de votre menu déroulant) puis choisissez l'élément à masquer de la liste qui est renvoyée (en commençant à zéro pour le premier élément) comme ceci:

// hide first item
$('#drp0 li').eq(0).css('visibility', 'hidden');

// hide second item
$('#drp0 li').eq(1).css('visibility', 'hidden');

// hide third item
$('#drp0 li').eq(2).css('visibility', 'hidden');

// etc

Depuis les documents jQuery:

.eq (index)

Description: réduisez l'ensemble des éléments correspondants à celui de l'index spécifié.

https://api.jquery.com/eq/

Vous voudrez peut-être utiliser display:none; pour réduire l'élément:

// hide second item
$('#drp0 li').eq(1).css('display', 'none');
0
spenibus 21 juil. 2015 à 10:04

// cache le premier élément

$(".btn4").click(function(){
      $('.dropdown-menu li').eq(0).css('visibility', 'hidden');
});
0
SVK 21 juil. 2015 à 09:31

1

 $("li:eq(1)").css('visibility', 'hidden');

2 ou vous pouvez donner à chaque "li" un identifiant, puis

$("#id").css('visibility', 'hidden');
0
sasalilili 21 juil. 2015 à 09:24