fadeIn或显示不适用于由ajax加载/添加的元素

-2

我搜索了类似的问题，但没有运气。fadeIn或显示不适用于由ajax加载/添加的元素

如果我用ajax向DOM添加元素，我无法控制它。我知道，实时方法适用于事件，但我只想显示/淡入。

有没有办法控制这些？

$("#menu > div > ul > li > a").click(function(){ 
    var page = $(this).attr("href").replace('#',''); 
    $.ajax({ 
     url: page + '.php', 
     beforeSend: function() { $("#page").fadeOut(); $('#loader').fadeIn("slow"); }, 
     complete: function() { $('#loader').fadeOut(); }, 
     success: function(data){ 
      $('body').append(data); 
      $(data).show(); 
     } 
    }); 
});

该数据包含以下及其字符串;

<div id="container-01"> <div class="left"> left </div> <div class="right"> right </div> </div>

谢谢。

来源

2011-09-06 Tim

发布你的代码，当我们不知道你做了什么时很难帮助你。 –

您可能试图在加载元素之前操作元素。尝试在load（）（或其他AJAX方法）的回调函数中做动画，看看是否有帮助。只是一个猜测。 – m90

这个问题很基本，实际上这个问题很常见。无论如何，我添加了代码示例。感谢减btw。 – Tim

我认为如果将所有加载的内容放入包装元素并尝试切换此包装，则会更好。如：

... 
success: function(data){ 
      $('#mywrapper').html(data); 
      $('#mywrapper').show(); 
     } 
...

这假定您的数据是HTML，顺便说一句。

编辑：看到你可以很容易地做到这一点你这样的传递的数据：

... 
success: function(data){ 
      $('body').append(data); 
      $('#container-01').show(); 
     } 
...

这将需要一个#container-01{display:none;}样式规则，但我想这应该没问题。

来源

2011-09-06 08:50:20 m90

耶，这个工程。我真的尝试过这个，但我想我错了什么。谢谢。 – Tim

我不知道该如何解释。但我在this link中发现了一些可以解决你的问题的东西。

来源

2011-09-06 08:40:59

是的，你需要在回调函数上做到这一点，你会得到你的数据，然后做淡入淡出。但是，在淡入之前，您可能需要先隐藏内容。您也可以隐藏容器div并执行.load来加载html，然后在回调中淡入淡出。

那么试试这个：

wrapper = $('<div class="wrapper">') 
$("body").append(wrapper) 
$(wrapper).hide().html(data).show();

出于某种原因，它没有得到来自任何的jsfiddle，数据竟把。所以，我只是在那里添加一些文字。 http://jsfiddle.net/G9Sa3/

来源

2011-09-06 08:49:30 Matt

也不起作用。 – Tim

@蒂姆，是的，我只是说你需要一个选择器。你需要包装它。我现在更新我的帖子。 – Matt

是的，感谢m90，我弄清楚了。但我假设我可以使用数据作为选择器因为我可以通过$（data）.attr（...）获取它的属性。 – Tim

fadeIn或显示不适用于由ajax加载/添加的元素

回答

相关问题