从服务器获取新记录后,我使用 jQuery 1.7.2 中的 AJAX 成功回调将新记录添加到列表并将其淡入。
function onSuccess (data, status, xhr) {
var record = $(template_html);
// populate `record` with `data` values.
body.append(record); // body is a jQuery object from closure scope
record.fadeIn('fast');
}
我在以下浏览器中对此进行了测试:
- IE 8
- IE 9
- Safari 5.1.7
- 火狐 14.0.1
- Chrome 21.0.1180.79
- 歌剧 11.64
除 Chrome 外,它在上述所有浏览器中都能一致地工作。它偶尔可以在 Chrome 中运行。
当它在 Chrome 中失败时,如果我单击“检查元素”或查看开发人员工具上的“元素”选项卡,或者单击使用 console.log(record)
打印到 Javascript 控制台的 DOM 元素, 它会导致新记录弹出可见性。
我知道正在正确创建、填充和附加 DOM 元素。问题是有时 Chrome 拒绝重新渲染 DOM。有时。
我试过替换 fadeIn
与 show
或 fadeTo
没有变化。
“类似问题”中的所有答案都不适合我。记录的标记只是 <div>
在<div>
s,我在添加新记录之前和之后验证了页面,以查看无效的 HTML 是否可能是问题所在。
有什么想法或想法吗?
最佳答案
试试这个:
$(document).ready(function () {
var body = document.body;
$(body).append(function () {
return $('<div>').addClass('Appended').html('Test Div </br> :)');
});
setTimeout(function () {
$('.Appended').fadeIn('fast');
// i'm used timeout to see the effect
}, 1500);
});
你可以通过这个 fiddle 来检查link
关于javascript - Chrome DOM 未针对 jQuery 附加/淡入更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12008760/