引用AJAX加載的DIV ID

Question

我在我的網站上有一個「命令中心」欄，它有一個登錄/註銷按鈕，一個我的帳戶按鈕和一個消息按鈕。如果用戶未登錄，則命令中心僅顯示登錄按鈕。如果用戶已登錄，則命令中心將顯示註銷，我的帳戶和消息按鈕。

我使用jQuery AJAX在用戶登錄或註銷時刷新命令中心。因此，當用戶登錄時，他/她的信息會發布到php頁面，並且回調函數將刷新命令中心。我有另一個jQuery AJAX函數，當它檢測到註銷按鈕（只出現在用戶登錄後）時，它會發布到一個php頁面，以便將用戶註銷。

由於註銷按鈕是通過AJAX加載的，我的註銷功能在初始頁面下載時加載，註銷功能不響應註銷按鈕上的點擊，即使該功能引用註銷按鈕的ID。

讓我的註銷功能識別AJAX加載的註銷按鈕的最佳方式是什麼？我最初的想法是在命令中心div上使用mouseover事件來封裝我的註銷功能，以便在用戶登錄並將光標移到裝載了AJAX的命令中心後，該功能將根據目前的HTML。缺點是每次用戶懸停在指揮中心時都會調用該函數，即使他們不想註銷。

有沒有更直接的解決方案呢？

Answer 1

你想要做的是使用jQuery的on()函數。

的代碼可能看起來像：

$('body').on('click', '#log-out-button-id', function(){ 
    // logout code 
}); 

本質上講，你附加事件到你的頁面上的元素不會發生變化。出於性能原因，您應該使用最接近的穩定父元素。 （在你的情況這可能是'#command-center'。

Answer 2

您可以在body使用jQuery .on功能（或者，更窄，在您的命令中心），通過你的註銷按鈕的選擇。通過這種方式，將執行每當按鈕存在 - 無論是已經存在的或將來補充說：

$("body").on("click", "#logout", function(event){ 
    // Your code 
});