jquery-触底加载无限滚动
Posted lutt
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jquery-触底加载无限滚动相关的知识,希望对你有一定的参考价值。
在我们将较长的执行结果展示到前端页面时可能会较占篇幅,可以设置一个无限滚动效果将其固定显示在一个固定大小的框框,并且执行结果实现实时更新
html代码:
<div id="post_deploy_result" name="deploy_result" style="height: 150px;overflow-y: auto;" class="zntest"></div>
js代码:
$("#"+result[‘progress‘]+"_result").append("<p>"+result["msg"]+"</p>"); # 将实时更新的内容渲染到页面 // $(".zntest").animate({ scrollTop: $(‘.zntest‘).prop("scrollHeight")}, 1000); # 页面自动滚动方法1 // var d = $(‘.zntest‘);d.scrollTop(d.prop("scrollHeight")); # 页面自动滚动方法2 $(‘.zntest‘).scrollTop($(‘.zntest‘)[0].scrollHeight); # 页面自动滚动方法3
最终效果就像cmd黑框口执行命令,实时更新状态并触底自动弹起
以上是关于jquery-触底加载无限滚动的主要内容,如果未能解决你的问题,请参考以下文章