Plug-in de boîte d'avertissement Bootstrap que vous devez apprendre tous les jours_compétences Javascript-js tutoriel-php.cn

Plug-in de boîte d'avertissement Bootstrap que vous devez apprendre tous les jours_compétences Javascript

WBOY

Libérer： 2016-05-16 15:04:01

original

1377 Les gens l'ont consulté

Les messages d'alerte sont principalement utilisés pour afficher des informations telles que des avertissements ou des messages de confirmation aux utilisateurs finaux. À l'aide du plugin Alert, vous pouvez ajouter une fonctionnalité de licenciement à tous les messages d'alerte.

Si vous souhaitez référencer les fonctionnalités de ce plugin séparément, vous devez alors référencer alert.js. Alternativement, comme mentionné dans le chapitre Présentation du plugin Bootstrap, vous pouvez référencer bootstrap.js ou une version minifiée de bootstrap.min.js.

1.Utilisation
Vous pouvez activer la fonction de renvoi de la boîte d'avertissement des deux manières suivantes :
1. Via l'attribut data : ajoutez la fonction annulable via l'API Data (API Data). Ajoutez simplement data-dismiss="alert" au bouton de fermeture et la fonction de fermeture sera automatiquement ajoutée à la boîte d'avertissement.

<a class="close" data-dismiss="alert" href="#" aria-hidden="true">
 &times;
</a>

Copier après la connexion

2. Via JavaScript : Ajouter une fonction annulable via JavaScript :
$(".alerte").alerte()

2. Exemple simple
La boîte d'avertissement est la boîte d'information à l'heure du clic.
1. Exemples de base

<div class="alert alert-warning">                   
 <button class="close" type="button" data-dismiss="alert">            
  <span>&times;</span>                     
 </button>                        
 <p>                          
  警告：您的浏览器不支持！                       
 </p>                          
</div>

Copier après la connexion

2. Ajoutez des effets de fondu entrant et sortant

Si vous utilisez JavaScript, vous pouvez remplacer data-dismiss="alert"

//JavaScript 方法

$('.close').on('click', function() {
 $('#alert').alert('close');
})

Copier après la connexion

Il existe deux types d'événements dans le plug-in Alert :

//事件，其他雷同

$('#alert').on('close.bs.alert', function() {
 alert('当 close 方法被触发时调用！');
});

Copier après la connexion

Pour plus d'informations sur Bootstrap, veuillez vous référer à la rubrique spéciale : Tutoriel d'apprentissage Bootstrap

Ce qui précède représente l'intégralité du contenu de cet article. J'espère qu'il sera utile à tout le monde d'apprendre le plug-in de la boîte d'avertissement Bootstrap.