web-dev-qa-db-fra.com

Désactiver un lien dans Bootstrap

Le premier exemple n'a pas fonctionné. J'ai besoin d'avoir toujours une liste pour désactiver les liens? Ou qu'est-ce qui ne va pas avec ma première démo?

<a class="disabled" href="#">Disabled link</a>

<ul class="nav nav-pills">
  ...
  <li role="presentation" class="disabled"><a href="#">Disabled link</a></li>
  ...
</ul>

https://jsfiddle.net/7y0u2amy/

htmlcsstwitter-bootstraptwitter-bootstrap-3
49
user2990084

Je pense que vous avez besoin de la classe btn.
Ce serait comme ceci:

<a class="btn disabled" href="#">Disabled link</a>
75
Caampa

Il semble que Bootstrap ne prend pas en charge les liens désactivés. Au lieu d’essayer d’ajouter une classe Bootstrap, vous pouvez ajouter une classe par vous-même et ajouter un peu de style à cela, juste comme ça:

a.disabled {
  /* Make the disabled links grayish*/
  color: gray;
  /* And disable the pointer events */
  pointer-events: none;
}
<!-- Make the disabled links unfocusable as well -->
<a href="#" class="disabled" tabindex="-1">Link to disable</a><br/>
<a href="#">Non-disabled Link</a>
50
Emanuela Colta

Si vous essayez de désactiver un lien, vous ne pouvez pas le faire. Je pense que vous pouvez trouver une réponse qui fonctionnera pour vous dans cette question ici.

Une option ici est d'utiliser

<a href="/" onclick="return false;">123n</a>

balise href désactivée

5
Cassandra

Vous ne pouvez pas définir les liens sur "désactivé" uniquement des éléments système tels que l'entrée, le champ de texte, etc.

Mais vous pouvez désactiver les liens avec jQuery/JavaScript

$('.disabled').click(function(e){
    e.preventDefault();
});

Enveloppez le code ci-dessus quel que soit l'événement pour lequel vous souhaitez désactiver les liens.

3
HelloWorld

Je viens de créer ma propre version en utilisant CSS. Comme je dois le désactiver, puis, lorsque le document est prêt, utilisez jQuery pour le rendre actif. Ainsi, un utilisateur ne peut pas cliquer sur un bouton tant que le document n'est pas prêt. Donc, je peux substituer avec AJAX à la place. La façon dont j'ai inventé était d’ajouter une classe à la balise anchor elle-même et de supprimer la classe lorsque le document est prêt. Besoins.

CSS:

a.disabled{
    pointer-events: none;
    cursor: default;
}

HTML:

<a class="btn btn-info disabled">Link Text</a>

JS:

$(function(){
    $('a.disabled').on('click',function(event){
        event.preventDefault();
    }).removeClass('disabled');
});
3
Mike