jQuery 和多个 li AppendTo
在附加到列表后，我在淡入某些 li 元素时遇到一些问题。
var html 包含列表项。
$(html).hide().appendTo('#thelist').fadeIn();
当加载单个 li 元素时，淡入有效，但是如果有多个 li 元素，jQuery 不会插入任何内容，更不用说淡入了。
有人可以建议修复吗？
编辑1：
示例 - 该列表是我的 ul 并且它没有隐藏。
<ul id="thelist">
<li>entry1</li>
<li>entry2</li>
<li>entry3</li>
</ul>
编辑2：该列表如上在HTML中存在，然后jQuery添加了我希望淡入的附加li。
编辑3： html包含一个jQuery ajax调用，其中包含html 来显示大约 5 里的文章内容。 当我不使用淡入或动画时，它会正确添加到 ul。当我添加淡入淡出时，它会将元素添加到 ul 但不会淡入它们。
编辑 4：这是加载函数：
$(function() {
$('.more').live('click',function() {
var element = $(this);
var msg = element.attr('id');
$('#morebutton').html('<p><em>Loading Articles.</em></p>');
$.ajax({
type: 'POST',
url: 'more.asp',
data: 'lastmsg=' + msg,
cache: false,
success: function(html){
$('#morebutton').remove();
$(html).hide().appendTo('#thelist').fadeIn();
}
});
});
});
解决方案：
我得到了它通过更改淡入：
$(html).hide().appendTo('#thelist').fadeIn();
似乎
var item = $(html).fadeIn();
$('#thelist').append(item);
这与 jQuery 以特定顺序链接的方式有关。
I'm having some trouble fading in some li elements after being appended to a list.
var html contains the list items.
$(html).hide().appendTo('#thelist').fadeIn();
The fade in works when there's a single li element loaded in however if there's multiple li's jQuery doesnt insert anything let alone fade it in.
Could anyone suggest a fix?
EDIT 1:
Example - thelist is my ul and it's not hidden.
<ul id="thelist">
<li>entry1</li>
<li>entry2</li>
<li>entry3</li>
</ul>
EDIT 2: The list exists as above in HTML and then the jQuery adds additional li's which I wish to be faded in.
EDIT 3: html contains a jQuery ajax call containing the html to display around 5 li's with article content.
It adds correctly to the ul when I don't use a fade in or animate. When I add a fade in it adds the elements to the ul however it doesn't fade them in.
EDIT 4: Here's the load function:
$(function() {
$('.more').live('click',function() {
var element = $(this);
var msg = element.attr('id');
$('#morebutton').html('<p><em>Loading Articles.</em></p>');
$.ajax({
type: 'POST',
url: 'more.asp',
data: 'lastmsg=' + msg,
cache: false,
success: function(html){
$('#morebutton').remove();
$(html).hide().appendTo('#thelist').fadeIn();
}
});
});
});
SOLUTION:
I got it to fade in by changing:
$(html).hide().appendTo('#thelist').fadeIn();
to
var item = $(html).fadeIn();
$('#thelist').append(item);
Seems like it's something to do with the way jQuery chains in a particular order.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
尝试使用之后
try using after
这对我来说效果很好。确保您的列表项和列表存在。检查任何 id 是否有拼写错误。
http://jsfiddle.net/gftdz/1/
This works fine for me. Ensure your list items and list exist. Check for typos of any ids.
http://jsfiddle.net/gftdz/1/
不确定，但也许你想要这样的东西
Not sure but may be you want something like this