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元素上失败

回答

相关问题