Question

我有一个链接，点击它时会在div上加载ajax内容：

HTML：

<div class="noticiaAberta"></div>

ajax功能：

$('#feedbackNoticia a').click(function(){
    $.post('teste.php', function(data){
        $('#noticiasBox .descricao').fadeOut(200);
        $('#noticiasBox .noticiaAberta').delay(200).fadeIn(200).html(data);
    })
});

这是ajax文件：

<div class="ajax">
    <a class="close"></a>
    <img src="assets/images/temp/noticia-clicada.jpg" alt="">
    <h1>teste adf asdf laskdfjl aksdjfl kasjdflk jasdlfk jasldkf jasd asdfk lahsdfkl jhasdkfj hasdfkhj</h1>
    <div class="pNoticias">
        <p>teste</p>
    </div>
</div>
<script type="text/javascript">
    $('.ajax .close').click(function(){
        $('.ajax').remove();
    })
</script>

ajax正在运行，但删除功能无法正常工作，当我点击它时只删除.close链接

有人知道它是什么吗？

Answer 1

更改Javascript，例如：

$(document).on('click','.ajax .close', function(){
    $('.ajax').remove();
})

这样，您将确保任何与指定选择器匹配的动态创建元素都将附加处理程序。

Answer 2

你的函数应该在JQuery就绪中定义，你应该使用委托来自动绑定来自Ajax结果的所有新元素。

  $(function(){
     $(document).delegate('.ajax, .close', 'click', function(){
         $('.ajax').remove();    
     });
  });

有关详细信息，请参阅此帖子：Dynamically Adding Elements and trying to use the selectors .click event Jquery

http://jsfiddle.net/fTk6t/

Answer 3

我刚刚解决了这个问题。问题是.ajax div没有高度，我放了float:left并解决了问题-.-

感谢所有人！

.remove（）与ajax加载的内容无法正常工作

3 个答案: