毎日学ぶべきブートストラップ警告ボックスプラグイン_JavaScript スキル-jsチュートリアル-php.cn

毎日学ぶべきブートストラップ警告ボックスプラグイン_JavaScript スキル

WBOY

リリース： 2016-05-16 15:04:01

オリジナル

1377 人が閲覧しました

アラートメッセージは、主に、警告や確認メッセージなどの情報をエンドユーザーに表示するために使用されます。アラートプラグインを使用すると、すべてのアラートメッセージに削除機能を追加できます。

このプラグインの機能を個別に参照したい場合は、alert.js を参照する必要があります。また、ブートストラッププラグインの概要の章で説明したように、bootstrap.js または bootstrap.min.js の縮小バージョンを参照することもできます。

1. 使用方法
次の 2 つの方法で警告ボックスの消去機能を有効にできます。
1. data 属性を介して: Data API (Data API) を介してキャンセル可能な関数を追加します。 data-dismiss="alert" を閉じるボタンに追加するだけで、閉じる関数が警告ボックスに自動的に追加されます。

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

ログイン後にコピー

2. JavaScript 経由: JavaScript 経由でキャンセル可能な機能を追加します:
$(".alert").alert()

2. 簡単な例
警告ボックスはクリック時の情報ボックスです。
1. 基本的な例

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

ログイン後にコピー

2. フェードインおよびフェードアウト効果を追加します

JavaScript を使用している場合は、data-dismiss="alert" を置き換えることができます

//JavaScript 方法

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

ログイン後にコピー

Alert プラグインには 2 種類のイベントがあります:

//事件，其他雷同

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

ログイン後にコピー

ブートストラップの詳細については、特別なトピックを参照してください:ブートストラップ学習チュートリアル

上記がこの記事の全内容です。Bootstrap 警告ボックスプラグインについて学ぶのに役立つことを願っています。

毎日学ぶべきブートストラップ警告ボックス プラグイン_JavaScript スキル

毎日学ぶべきブートストラップ警告ボックスプラグイン_JavaScript スキル