2つのイベントが発生し、フェードアウトが終了しないアンカータグ

Question

ログアウトボタンを2回起動させようとしています。最初はシステムから単にログアウトしてから、jQueryを使用してアラートを発生させ、3秒間滞在してからフェードアウトしたいと考えています。それは現在働いていますが、非常に迅速に消えます。私はhref =ビットに "＃"を追加しなければなりません、そして、それはすでにユーザーをシステムからログアウトしているアクションを取り消します。私は参照用にSilverstripe SSテンプレートファイルで作業しています。それを壊すことなく "{Link}ログアウト"に "＃"を追加する方法はありますか？これは、テストサーバー私はそうのようなアンカーに追加するときにノーフィドル、申し訳ありません...

アラートが正常に動作しますが、その後ログアウトしないである：

href="# {$Link}logout" 

ない現在のHTMLフェード：

<a href="{$Link}logout" id="show-my-alert" class="btn btn-default btn-menu-donate-offcanvas btn-side"> 
<i class="fa fa-sign-out fa-fw"></i><br><span class="donate-text"> SIGN OUT</a> 

<div id="my-alert" class="alert alert-warning hidden" role="alert"> 
<button type="button" class="close" data-dismiss="alert" aria-label="Close">  
    <span aria-hidden="true">&times;</span> 
</button> 
<strong>Warning!</strong> You are now logged out of the system. 

jQueryの

<script> 

$("#show-my-alert, .close").click(function() { 
$("#my-alert").toggleClass("hidden").fadeIn(3000); 
$("#my-alert").fadeOut(3000); 
}); 

</script> 

AS OF NOW使用中のFINAL SCRIPT：

$(function() { 
$("#show-my-alert, .close").click(function(e) { 
var isClosing = $("#my-alert").data("isClosing"); 
if (isClosing === undefined || isClosing != true) { 
    $("#my-alert").toggleClass("hidden").fadeOut(3000, function() { 

    $("#my-alert").data("isClosing", true); 
    }); 
    e.preventDefault(); // prevent logout during fading 
} else { 
    // this time logout 
    } 
}); 
}); 

Answer 1

（私はこれはあなたを助けることができる願っています）私はあなたが使用している製品を知りませんが、簡単なjQueryの中で、私が行うことができます。

$(function() { 
 
    $("#show-my-alert, .close").click(function(e) { 
 
    var isClosing = $("#my-alert").data('isClosing'); 
 
    if (isClosing === undefined || isClosing != true) { 
 
     $("#my-alert").toggleClass("hidden").fadeOut(3000, function() { 
 
     $("#my-alert").fadeIn(3000, function() { 
 
      document.getElementById("show-my-alert").click(); 
 
     }); 
 
     $("#my-alert").data('isClosing', true); 
 
     }); 
 
     e.preventDefault(); // prevent logout during fading 
 
    } else { 
 
     // this time logout 
 
    } 
 
    }); 
 
});

.hidden { 
 
    visibility: hidden; 
 
}

<script src="https://code.jquery.com/jquery-1.12.1.min.js"></script> 
 

 

 
<a href="{$Link}logout" id="show-my-alert" class="btn btn-default btn-menu-donate-offcanvas btn-side"> 
 
    <i class="fa fa-sign-out fa-fw"></i><br><span class="donate-text"> SIGN OUT</a> 
 

 
<div id="my-alert" class="alert alert-warning hidden" role="alert"> 
 
    <button type="button" class="close" data-dismiss="alert" aria-label="Close"> 
 
     <span aria-hidden="true">&times;</span> 
 
    </button> 
 
    <strong>Warning!</strong> You are now logged out of the system. 
 
</div>