Latest web development tutorials
×

Bootstrap コース

Bootstrap コース Bootstrap 簡単な紹介 Bootstrap 設置環境

Bootstrap CSS

Bootstrap CSS 概要 Bootstrap グリッド方式 Bootstrap 組版 Bootstrap コード Bootstrap テーブル Bootstrap フォーム Bootstrap プッシュボタン Bootstrap 絵 Bootstrap 補助クラス Bootstrap レスポンシブユーティリティ

Bootstrap レイアウトコンポーネント

Bootstrap フォントのアイコン Bootstrap ドロップダウンメニュー Bootstrap ボタングループ Bootstrap ボタンのドロップダウンメニュー Bootstrap 入力ボックスグループ Bootstrap ナビゲーション要素 Bootstrap ナビゲーションバー Bootstrap パン粉 Bootstrap ページング Bootstrap ラベル Bootstrap バッジ Bootstrap 大画面 Bootstrap ページタイトル Bootstrap サムネイル Bootstrap 警告 Bootstrap プログレスバー Bootstrap マルチメディアオブジェクト Bootstrap 一覧グループ Bootstrap パネル Bootstrap Wells

Bootstrap ウィジェット

Bootstrap プラグインの概要 Bootstrap 転移効果 Bootstrap モーダルボックス Bootstrap ドロップダウンメニュー Bootstrap スクロールモニター Bootstrap タブ Bootstrap ツールヒント Bootstrap ポップアップボックス Bootstrap 警告ボックス Bootstrap プッシュボタン Bootstrap 折り畳みます Bootstrap 回転木馬 Bootstrap 追加のナビゲーション

Bootstrap 他の

Bootstrap UI エディタ Bootstrap V2 コース Bootstrap HTML コーディング規約 Bootstrap CSS コーディング規約

警告ボックスブートストラップ

ボックス警告(警告)メッセージは、主にエンドユーザーが警告や確認のメッセージをしたいような情報を表示するために使用されます。 警告(アラート)プラグインでボックスは、すべての警告メッセージボックスにキャンセル(解任)機能を追加することができます。

使用法

あなたは(解雇)機能を解除する警告ボックスを有効にする方法は2つあります。

  • データ属性を使用して:機能を解除するために、データAPI(データAPI)を添加することにより、 データのみ-却下= "警告"オフにするボタンを追加する必要がありそれが自動的に警告ボックスをオフにする機能を追加します。
    <a class="close" data-dismiss="alert" href="#" aria-hidden="true">
    	&タイムズ;
    こちら</a>
    
  • JavaScriptの場合:JavaScriptを通って機能をキャンセルする追加:
    $( "。警告」)。アラート()
    

次の例では、データ属性の使用による警告ボックス(アラート)ウィジェットの使用方法を示します。

<DIV クラス= "警告警告警告" > <A href = "#" クラス = "近いです" > = "警告" データ却下 &回; </ A> <STRONG> 警告! </ strong> ネットワーク接続に問題があります。 </ DIV>

»をお試しください

結果は以下の通りであります:

ボックス警告(アラート)ウィジェット

オプション

オプションはありません。

ウェイ

ここではいくつかの警告ボックス(アラート)プラグイン便利な方法は、次のとおりです。

方法描述实例
.alert()该方法让所有的警告框都带有关闭功能。
$('#identifier').alert();
Close Method.alert('close')关闭所有的警告框。
$('#identifier').alert('close');
閉じたときにアニメーションを有効にするには、あなたが.fadeとする.inクラスを追加ていることを確認します

次の例では、()メソッドを.alert示しています。

<H3> 警告ボックス(アラート)ウィジェットアラート()メソッド </ H3> <DIV ID = "myAlert" クラス= "警告アラート成功」 > <A href = "#" クラス = "近いです" = "警告">データ・解任 &回; </ A> <強い> 成功! </ strong> 結果は成功です。 </ DIV> <DIV ID = "myAlert" クラス= "警告警告警告" > <A href = "#" クラス = "近いです" = "警告">データ・解任 &回; </ A> <STRONG> 警告! </ strong> ネットワーク接続に問題があります。 </ DIV> <スクリプト>
$(関数(){$( ".close」)をクリックします(関数(){$(" #myAlert」)の警告(); ..});});
</スクリプト> [/ mycode2] </ div>の<BR> <A ターゲット = "_blank" href = "/try/try.php?filename=bootstrap3-plugin-alert-method1" クラス = "tryitbtn"> してみてください»</ A> </ DIV> <P> 次の例では 、<B> .alert( '近い' を示している使い方を する</ b> 方法:</ P> <DIV クラス = "例"> <H2 クラス = "例"> インスタンス </ H2> <DIV クラス= "example_code"> [mycode3タイプ= "HTML"] <H3> 警告ボックス(アラート)ウィジェットアラート( '近い')メソッド </ H3> <DIV ID = "myAlert" クラス= "警告アラート成功」 > <A href = "#" クラス = "近いです" = "警告">データ・解任 &回; </ A> <強い> 成功! </ strong> 結果は成功です。 </ DIV> <DIV ID = "myAlert" クラス= "警告警告警告" > <A href = "#" クラス = "近いです" = "警告">データ・解任 &回; </ A> <STRONG> 警告! </ strong> ネットワーク接続に問題があります。 </ DIV> <スクリプト>
$(関数(){$( ".close」)をクリックします(関数(){$(" #myAlert」)警告( '近いです'); ..});});
</スクリプト>

»をお試しください

あなたは機能は、任意の警告ボックスをオフにし、すべての警告ボックスがオフに適用されている見ることができ、他の残りの警告ボックスが閉じます。

イベント

次の表は、警告ボックス(アラート)プラグインがイベントで使用されるように一覧表示されます。 これらのイベントは時フック関数を使用することができます。

事件描述实例
close.bs.alert当调用close实例方法时立即触发该事件。
$('#myalert').bind('close.bs.alert', function () {
  // 执行一些动作...
})
closed.bs.alert当警告框被关闭时触发该事件(将等待 CSS 过渡效果完成)。
$('#myalert').bind('closed.bs.alert', function () {
	// 执行一些动作...
})

次の例では、イベントボックス警告(アラート)プラグインを示しています。

<DIV ID = "myAlert" クラス= "警告アラート成功」 > <A href = "#" クラス = "近いです" = "警告">データ・解任 &回; </ A> <強い> 成功! </ strong> 結果は成功です。 </ DIV> <スクリプト>
$(関数(){$( "#myAlert」)。バインド( 'closed.bs.alert'、機能 () { 警告 (「警告 メッセージボックスが閉じられています。 ");});});
</スクリプト>

»をお試しください

結果は以下の通りであります:

警告ボックス(アラート)プラグインのイベント