Bootstrap Alert Divは、最初のAjaxリクエストのキャンセル時に2番目のajaxリクエストに表示されません。

Question

開始時に非表示になっているHTMLファイルに警告があります。以下のコード。

<div class="alert alert-dismissible" role="alert" id="msgdiv" style="margin-bottom:5px;display: none;"> 
    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
    <span id="emsg"></span> 
</div> 

は今、私が最初に私が今してまで隠されていたこのdiv要素は、このdiv要素に成功またはエラーのクラスを追加表示し、フォームを送信し、応答に基づいてするAjaxリクエストを送信します。

console.log($("#msgdiv")); 
$("#msgdiv").show(); 
if (result.is_success) { 
    $("#msgdiv").removeClass("alert-warning"); 
    $("#msgdiv").addClass("alert-success"); 

} else { 
    $("#msgdiv").removeClass("alert-success"); 
    $("#msgdiv").addClass("alert-warning"); 
} 
$("#emsg").html(result.message); 

ここで最初に応答が返されると、このdivが表示されます。私は十字ボタンをクリックしてdivをキャンセルします。
私はページを更新せずにAjaxを使用して新しい値でフォームを送信し、このdivは表示されません。両方のケースで同じ結果が返されました。 JSコードの両方のシナリオでdiv要素を出力しました。出力は以下のとおりです。

初回：

[div#msgdiv.alert.alert-dismissible, context: document, selector: "#msgdiv"] 

2回目：下の画像で

n.fn.init {context: document, selector: "#msgdiv"} 

詳細。

なぜこの出来事はありますか？なぜコンソールのログに違いがありますか？ HTMLとJSの観点からはどういう意味ですか？

Answer 1

アラートが閉じられると、アラートはDOMから削除されます。

あなたは、後で再表示され、次のように閉じるボタンでデータ・解任=「警告」を削除するアラートにしたい場合：

<div class="alert alert-dismissible" role="alert" id="msgdiv" style="margin-bottom:5px;display: none;"> 
    <button type="button" class="close" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
    <span id="emsg"></span> 
</div> 

を次に、それが押されていますとき、単に警告を非表示にする閉じるボタンをバインド：

$('.alert .close').click(function(){ 
    $(this).parent().hide(); 
});