jQuery在AJAX插入的DOM元素上失敗

我在類close上寫了一個簡單的jQuery函數。jQuery在AJAX插入的DOM元素上失敗

$(function() { 
    $(".close").click(function() { 
     $(this).parent().fadeTo(400, 0, function() { // Links with the class "close" will close parent 
      $(this).slideUp(400); 
     }); 
     return false; 
    }); 
});

它的工作正常，但如果我插入新的DOM元素使用AJAX這個功能失敗？爲什麼是這樣？雖然我知道在通過AJAX響應插入的頁面上編寫相同功能的解決方案。我做到了，它的工作。爲什麼它不在全球範圍內工作？

我試圖用$(".close").on("click", function(event){替換$(".close").click(function() {，但它並沒有給出我的問題的確切解決方案。

來源

2013-04-16 Sankalp

是監守點擊事件上班元素應該出現在文檔中使用...委派on事件

$(document).on("click",".close",function() { 
    $(this).parent().fadeTo(400, 0, function() { // Links with the class "close" will close parent 
     $(this).slideUp(400); 
    }); 
    return false; 
});

加入你的ajax成功函數作品後單擊事件，但後來我更喜歡去用在on委派事件（因爲jQuery中on是引進用於此目的）..

我建議你使用最接近的靜態父，比document本身有更好的表現...

link閱讀更多有關事件

來源

2013-04-16 07:19:59 bipen

使用on和fadeOut delgated：

$("body").on('click', '.close', function() { 
    $(this).parent().fadeOut(); 
    return false; 
});

此外，您不必效果基本show淡出後，由於該元素是已經隱藏。
其次，默認的淡入淡出時間已經是400，您不需要再次聲明速度。

來源

2013-04-16 07:20:11

它不起作用....我嘗試過插入DOM的元素。它失敗了 – Sankalp

什麼都不起作用？ '.parent（）'指的是你想淡出的正確元素？ –

是的，就是這樣。一切都是一樣的。它只有在插入元素上使用相同的js代碼時纔有效。 – Sankalp

因爲當DOM準備就緒時，jQuery將click事件綁定到元素。它不會監視與選擇器匹配的新元素，因此在添加之後添加的任何元素將會在您的函數中綁定點擊事件，其中而不是。爲此，您必須在AJAX請求完成後執行$('.close').click(...)。

來源

2013-04-16 07:20:17

實際上，如果你要反覆靜態地重新綁定_every_'.close'元素，那麼你必須首先_unbind_所有現有的處理程序，否則你最終會註冊重複的處理程序。 – Alnitak

的確應該調用'$（'。close'）。unbind（'click'）'。 – 2013-04-16 17:53:21

您是否嘗試過使用'live'方法。

$(".close").live('click',function() { 
    $(this).parent().fadeTo(400, 0, function() { // Links with the class "close" will close parent 
     $(this).slideUp(400); 
    }); 
    return false; 
});

來源

2013-04-16 08:27:13 sathish

jQuery在AJAX插入的DOM元素上失敗

回答

相關問題