123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680 |
-
-
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>镜像站@流加载文档 - Layui</title>
- <meta name="renderer" content="webkit">
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
- <meta name="apple-mobile-web-app-status-bar-style" content="black">
- <meta name="apple-mobile-web-app-capable" content="yes">
- <meta name="format-detection" content="telephone=no">
- <script>
- ;!function(){self!==parent&&(location.href="http://www.baidu.com/")}();
- </script>
- <link rel="stylesheet" href="/public/layui/dist/css/layui.css" tppabs="http://res.layui.com/layui/dist/css/layui.css?t=1632428048260" media="all">
- <link rel="stylesheet" href="/public/static/css/global.css" tppabs="http://res.layui.com/static/css/global.css?t=1632428048260-19" media="all">
- </head>
- <body>
- <div class="layui-header header header-doc" autumn>
- <div class="layui-container">
- <a class="logo" href="../../index.html" tppabs="http://www.layui.com/">
- <img src="/public/static/images/layui/logo.png" tppabs="http://res.layui.com/static/images/layui/logo.png" alt="layui">
- </a>
- <div class="layui-form layui-hide-xs component" lay-filter="LAY-site-header-component"></div>
- <div class="layui-hide-xs site-notice"></div>
-
- <ul class="layui-nav" id="LAY_NAV_TOP">
- <li class="layui-nav-item layui-this">
- <a href="../index.html" tppabs="http://www.layui.com/doc/">文档</a>
- </li>
- <li class="layui-nav-item ">
- <a href="../../demo/index.html" tppabs="http://www.layui.com/demo/">示例</a>
- </li>
-
- <li class="layui-nav-item">
- <a href="javascript:;">
- <!--<span class="layui-badge-dot" style="left:0; right: auto; margin: -4px 0 0 5px;"></span>-->
- 周边
- </a>
- <dl class="layui-nav-child layui-nav-child-c">
- <dd class="layui-hide-sm layui-show-xs" lay-unselect>
- <a href="https://gitee.com/sentsin/layui/issues" target="_blank" rel="nofollow">问题反馈</a>
- <hr>
- </dd>
-
- <dd lay-unselect><a href="../../alone.html" tppabs="http://www.layui.com/alone.html" target="_blank" lay-unselect>独立组件</a></dd>
- <dd lay-unselect><a href="../../../fly.layui.com/extend/index.html" target="_blank">扩展组件</a></dd>
- </dl>
- </li>
-
- <li class="layui-nav-item layui-hide-xs">
- <a href="http://gitee.com/sentsin/layui/issues" target="_blank" rel="nofollow">反馈</a>
- </li>
- </ul>
- </div>
- </div>
-
- <!-- 让IE8/9支持媒体查询,从而兼容栅格 -->
- <!--[if lt IE 9]>
- <script src="../../../other/html5shiv/r29/html5.min.js" tppabs="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
- <script src="../../../other/respond.js/1.4.2/respond.min.js" tppabs="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
- <![endif]-->
-
- <ul class="site-dir">
- <li><a href="#use"><cite>使用</cite></a></li>
- <li><a href="#load"><cite>信息流</cite></a></li>
- <li><a href="#lazyimg"><cite>图片懒加载</cite></a></li>
- </ul>
- <div class="layui-container layui-row">
-
- <div class="layui-col-md3">
- <div class="layui-panel site-menu">
- <ul class="layui-menu layui-menu-lg">
- <li class="layui-menu-item-group" lay-options="{type: 'group', isAllowSpread: true}">
- <div class="layui-menu-body-title">
- 基础说明
- </div>
- <hr>
- <ul>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../index.html" tppabs="http://www.layui.com/doc/">
- <span>开始使用 </span>
- <span class="layui-font-12 layui-font-gray">Getting Started</span>
- </a>
-
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../base/infrastructure.html" tppabs="http://www.layui.com/doc/base/infrastructure.html">
- <span>底层方法 </span>
- <span class="layui-font-12 layui-font-gray">基础支撑</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../base/element.html" tppabs="http://www.layui.com/doc/base/element.html">
- <span>页面元素 </span>
- <span class="layui-font-12 layui-font-gray">规范 公共类 属性</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../base/modules.html" tppabs="http://www.layui.com/doc/base/modules.html">
- <span>模块规范 </span>
- <span class="layui-font-12 layui-font-gray">使用 扩展</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../base/faq.html" tppabs="http://www.layui.com/doc/base/faq.html">
- <span>常见问题 </span>
- <span class="layui-font-12 layui-font-gray">FAQ</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../base/changelog.html" tppabs="http://www.layui.com/doc/base/changelog.html">
- <span>更新日志 </span>
- <span class="layui-font-12 layui-font-gray">changelog</span>
-
- <span class="layui-badge-dot"></span>
-
- </a>
- </div>
- </li>
- </ul>
- </li>
-
- <li class="layui-menu-item-group" lay-options="{type: 'group', isAllowSpread: true}">
- <div class="layui-menu-body-title">
- 页面元素
- </div>
- <hr>
- <ul>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/layout.html" tppabs="http://www.layui.com/doc/element/layout.html">
- <span>布局 </span>
- <span class="layui-font-12 layui-font-gray">栅格 后台管理布局</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/color.html" tppabs="http://www.layui.com/doc/element/color.html">
- <span>颜色 </span>
- <span class="layui-font-12 layui-font-gray">主色调 颜色搭配</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/icon.html" tppabs="http://www.layui.com/doc/element/icon.html">
- <span>图标 </span>
- <span class="layui-font-12 layui-font-gray">iconfont 字体图标</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/anim.html" tppabs="http://www.layui.com/doc/element/anim.html">
- <span>动画 </span>
- <span class="layui-font-12 layui-font-gray">内置 CSS3 动画</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/button.html" tppabs="http://www.layui.com/doc/element/button.html">
- <span>按钮 </span>
- <span class="layui-font-12 layui-font-gray">button</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/form.html" tppabs="http://www.layui.com/doc/element/form.html">
- <span>表单 </span>
- <span class="layui-font-12 layui-font-gray">form 元素集合</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/nav.html" tppabs="http://www.layui.com/doc/element/nav.html">
- <span>导航 </span>
- <span class="layui-font-12 layui-font-gray">nav 面包屑</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/menu.html" tppabs="http://www.layui.com/doc/element/menu.html">
- <span>菜单 </span>
- <span class="layui-font-12 layui-font-gray">menu 基础菜单</span>
-
- <span class="layui-badge-dot"></span>
-
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/tab.html" tppabs="http://www.layui.com/doc/element/tab.html">
- <span>选项卡 </span>
- <span class="layui-font-12 layui-font-gray">Tabs 切换</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/progress.html" tppabs="http://www.layui.com/doc/element/progress.html">
- <span>进度条 </span>
- <span class="layui-font-12 layui-font-gray">progress</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/panel.html" tppabs="http://www.layui.com/doc/element/panel.html">
- <span>面板 </span>
- <span class="layui-font-12 layui-font-gray">panel 卡片 折叠</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/table.html" tppabs="http://www.layui.com/doc/element/table.html">
- <span>表格 </span>
- <span class="layui-font-12 layui-font-gray">静态 table</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/badge.html" tppabs="http://www.layui.com/doc/element/badge.html">
- <span>徽章 </span>
- <span class="layui-font-12 layui-font-gray">小圆点 小边框</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/timeline.html" tppabs="http://www.layui.com/doc/element/timeline.html">
- <span>时间线 </span>
- <span class="layui-font-12 layui-font-gray">timeline</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="../element/auxiliar.html" tppabs="http://www.layui.com/doc/element/auxiliar.html">
- <span>辅助 </span>
- <span class="layui-font-12 layui-font-gray">引用 字段集 横线等</span>
- </a>
- </div>
- </li>
- </ul>
- </li>
-
- <li class="layui-menu-item-group" lay-options="{type: 'group', isAllowSpread: true}">
- <div class="layui-menu-body-title">
- 内置模块
- </div>
- <hr>
- <ul>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="layer.html" tppabs="http://www.layui.com/doc/modules/layer.html">
- <span>弹出层 </span>
- <span class="layui-font-12 layui-font-gray">layer</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="laydate.html" tppabs="http://www.layui.com/doc/modules/laydate.html">
- <span>日期与时间选择 </span>
- <span class="layui-font-12 layui-font-gray">laydate</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="laypage.html" tppabs="http://www.layui.com/doc/modules/laypage.html">
- <span>分页 </span>
- <span class="layui-font-12 layui-font-gray">laypage</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="laytpl.html" tppabs="http://www.layui.com/doc/modules/laytpl.html">
- <span>模板引擎 </span>
- <span class="layui-font-12 layui-font-gray">laytpl</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="table.html" tppabs="http://www.layui.com/doc/modules/table.html">
- <span>数据表格 </span>
- <span class="layui-font-12 layui-font-gray">table</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="form.html" tppabs="http://www.layui.com/doc/modules/form.html">
- <span>表单 </span>
- <span class="layui-font-12 layui-font-gray">form</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="upload.html" tppabs="http://www.layui.com/doc/modules/upload.html">
- <span>文件上传 </span>
- <span class="layui-font-12 layui-font-gray">upload</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="dropdown.html" tppabs="http://www.layui.com/doc/modules/dropdown.html">
- <span>下拉菜单 </span>
- <span class="layui-font-12 layui-font-gray">dropdown</span>
-
- <span class="layui-badge-dot"></span>
-
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="transfer.html" tppabs="http://www.layui.com/doc/modules/transfer.html">
- <span>穿梭框 </span>
- <span class="layui-font-12 layui-font-gray">transfer</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="tree.html" tppabs="http://www.layui.com/doc/modules/tree.html">
- <span>树形组件 </span>
- <span class="layui-font-12 layui-font-gray">tree</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="colorpicker.html" tppabs="http://www.layui.com/doc/modules/colorpicker.html">
- <span>颜色选择器 </span>
- <span class="layui-font-12 layui-font-gray">colorpicker</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="element.html" tppabs="http://www.layui.com/doc/modules/element.html">
- <span>常用元素操作 </span>
- <span class="layui-font-12 layui-font-gray">element</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="slider.html" tppabs="http://www.layui.com/doc/modules/slider.html">
- <span>滑块 </span>
- <span class="layui-font-12 layui-font-gray">slider</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="rate.html" tppabs="http://www.layui.com/doc/modules/rate.html">
- <span>评分 </span>
- <span class="layui-font-12 layui-font-gray">rate</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="carousel.html" tppabs="http://www.layui.com/doc/modules/carousel.html">
- <span>轮播 </span>
- <span class="layui-font-12 layui-font-gray">carousel</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="layedit.html" tppabs="http://www.layui.com/doc/modules/layedit.html">
- <span>富文本编辑器 </span>
- <span class="layui-font-12 layui-font-gray">layedit</span>
- </a>
- </div>
- </li>
- <li class="layui-menu-item-checked2">
- <div class="layui-menu-body-title">
- <a href="flow.html" tppabs="http://www.layui.com/doc/modules/flow.html">
- <span>流加载 </span>
- <span class="layui-font-12 layui-font-gray">flow</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="util.html" tppabs="http://www.layui.com/doc/modules/util.html">
- <span>工具组件 </span>
- <span class="layui-font-12 layui-font-gray">util</span>
- </a>
- </div>
- </li>
- <li class="">
- <div class="layui-menu-body-title">
- <a href="code.html" tppabs="http://www.layui.com/doc/modules/code.html">
- <span>代码高亮显示 </span>
- <span class="layui-font-12 layui-font-gray">code</span>
- </a>
- </div>
- </li>
- </ul>
- </li>
- </ul>
- </div>
- <div class="layui-hide-v"> - </div>
- </div>
-
- <div class="layui-col-md9 site-content">
- <h1 class="site-h1"><i class="layui-icon"></i> 流加载文档 - layui.flow</h1>
- <blockquote class="site-text layui-elem-quote">
- 该模块包含<em>信息流加载</em>和<em>图片懒加载</em>两大核心支持,无论是对服务端、还是前端体验,都有非常大的性能帮助。你可能已经在太多的地方看到她们的身影了,但不妨现在开始,体验一下Layui更为简单和高效的Flow吧。
- </blockquote>
- <blockquote class="site-text layui-elem-quote">
- <p>模块加载名称:<em>flow</em></p>
- </blockquote>
-
-
-
- <div class="site-title">
- <a name="use"></a>
- <fieldset><legend>使用</legend></fieldset>
- </div>
- <div class="site-text">
- <p>flow模块包含两个核心方法,如下所示:</p>
- <pre class="layui-code">
- layui.use('flow', function(){
- var flow = layui.flow;
- //信息流
- flow.load(options);
-
- //图片懒加载
- flow.lazyimg(options);
- });
- </pre>
- <p>下面将对她们进行详细介绍。</p>
- </div>
-
- <div class="site-title">
- <a name="load"></a>
- <fieldset><legend>信息流</legend></fieldset>
- </div>
- <div class="site-text">
- <p>信息流即异步逐页渲染列表元素,这是你页面已经存在的一段列表,你页面初始时只显示了6个</p>
- <pre class="layui-code" lay-title="HTML" lay-encode="true">
- <ul id="demo">
- <li>1</li>
- <li>2</li>
- ……
- <li>6</li>
- </ul>
- </pre>
- <p>你想通过加载更多来显示余下列表,那么你只需要执行方法:<a>flow.load(options)</a> 即可</p>
- <pre class="layui-code" lay-title="JavaScript" lay-encode="true">
- layui.use('flow', function(){
- var $ = layui.jquery; //不用额外加载jQuery,flow模块本身是有依赖jQuery的,直接用即可。
- var flow = layui.flow;
- flow.load({
- elem: '#demo' //指定列表容器
- ,done: function(page, next){ //到达临界点(默认滚动触发),触发下一页
- var lis = [];
- //以jQuery的Ajax请求为例,请求下一页数据(注意:page是从2开始返回)
- $.get('/api/list?page='+page, function(res){
- //假设你的列表返回在data集合中
- layui.each(res.data, function(index, item){
- lis.push('<li>'+ item.title +'</li>');
- });
-
- //执行下一页渲染,第二参数为:满足“加载更多”的条件,即后面仍有分页
- //pages为Ajax返回的总页数,只有当前页小于总页数的情况下,才会继续出现加载更多
- next(lis.join(''), page < res.pages);
- });
- }
- });
- });
- </pre>
- <p>上述是一个比较简单的例子,以下是信息流完整的参数支撑(即options对象),它们将有助于你更灵活地应对各种场景</p>
- <table class="layui-table">
- <thead>
- <tr>
- <th>参数</th>
- <th>类型</th>
- <th>描述</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>elem</td>
- <td>string</td>
- <td>指定列表容器的选择器</td>
- </tr>
- <tr>
- <td>scrollElem</td>
- <td>string</td>
- <td>滚动条所在元素选择器,默认document。如果你不是通过窗口滚动来触发流加载,而是页面中的某一个容器的滚动条,那么通过该参数指定即可。</td>
- </tr>
- <tr>
- <td>isAuto</td>
- <td>boolean</td>
- <td>是否自动加载。默认true。如果设为false,点会在列表底部生成一个“加载更多”的button,则只能点击它才会加载下一页数据。</td>
- </tr>
- <tr>
- <td>end</td>
- <td>string</td>
- <td>用于显示末页内容,可传入任意HTML字符。默认为:没有更多了</td>
- </tr>
- <tr>
- <td>isLazyimg</td>
- <td>boolean</td>
- <td>是否开启图片懒加载。默认false。如果设为true,则只会对在可视区域的图片进行按需加载。但与此同时,在拼接列表字符的时候,你不能给列表中的img元素赋值src,必须要用lay-src取代,如:
- <pre class="layui-code" lay-title="JavaScript片段">
- layui.each(res.data, function(index, item){
- lis.push('<li><img lay-src="'+ item.src +'"></li>');
- });
- </pre>
- </td>
- </tr>
- <tr>
- <td>mb</td>
- <td>number</td>
- <td>与底部的临界距离,默认50。即当滚动条与底部产生该距离时,触发加载。注意:只有在isAuto为true时有效。<br>额,等等。。mb=margin-bottom,可不是骂人的呀。</td>
- </tr>
- <tr>
- <td>done</td>
- <td>function</td>
- <td>到达临界点触发加载的回调。信息流最重要的一个存在。携带两个参数:
- <pre class="layui-code" lay-title="JavaScript片段">
- done: function(page, next){
- //请注意:layui 1.0.5 之前的版本是从第2页开始返回,也就是说你的第一页数据并非done来触发加载
- (为之前这个愚蠢的设计表示抱歉)
- //从 layui 1.0.5 的版本开始,page是从1开始返回,初始时即会执行一次done回调。
- //console.log(page) //获得当前页
-
- //执行下一页渲染,第二参数为:满足“加载更多”的条件,即后面仍有分页
- //只有当前页小于总页数的情况下,才会继续出现加载更多
- next('列表HTML片段', page < res.pages);
- }
- </pre>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
-
- <div class="site-title">
- <a name="lazyimg"></a>
- <fieldset><legend>图片懒加载</legend></fieldset>
- </div>
- <div class="site-text">
- <p>应该说比当前市面上任何一个懒加载的实现都更为强劲和轻量,她用不足80行代码巧妙地提供了一个始终加载当前屏图片的高性能方案(无论上滑还是下滑)。对你的网站因为图片可能带来的压力,可做出很好的应对。</p>
- <p>语法:<em>flow.lazyimg(options)</em></p>
- <pre class="layui-code">
- layui.use('flow', function(){
- var flow = layui.flow;
- //当你执行这样一个方法时,即对页面中的全部带有 lay-src 的 img 元素开启了懒加载(当然你也可以指定相关 img)
- flow.lazyimg();
- });
- </pre>
- <p>如上所述,它只会针对以下 img 元素有效:</p>
- <pre class="layui-code" lay-title="HTML">
- <img src="占位图地址" lay-src="预加载图地址">
- <img src="" src="bbb.jpg">
- <img src="" lay-src="ccc.jpg">
- </pre>
- <blockquote class="layui-elem-quote layui-text">
- <span class=" layui-font-red">占位图功能为 layui 2.6.6 开始新增。</span>
- 这本应在 1.0 就该支持,但由于重心在其他组件,导致姗姗来迟。
- </blockquote>
-
- <p>如你所见,图片懒加载的使用极其简单,其参数(options 对象)可支持的 key 如下表所示:</p>
- <table class="layui-table">
- <thead>
- <tr>
- <th>参数</th>
- <th>类型</th>
- <th>描述</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>elem</td>
- <td>string</td>
- <td>指定开启懒加载的img元素选择器,如 elem: '.demo img' 或 elem: 'img.load'</td>
- </tr>
- <tr>
- <td>scrollElem</td>
- <td>string</td>
- <td>滚动条所在元素选择器,默认document。如果你不是通过窗口滚动来触发流加载,而是页面中的某一个容器的滚动条,那么通过该参数指定即可。</td>
- </tr>
- <tr>
- </tbody>
- </table>
- </div>
-
- <div class="site-title">
- <a name="other"></a>
- <fieldset><legend>结语</legend></fieldset>
- </div>
- <div class="site-text">
- <p>如果还有各种流行的流加载,你可以给我们提供建议,我们会在layui后续版本中选择性加入。</p>
- </div>
-
- <div class="layui-elem-quote">
- <p>layui - 在每一个细节中,用心与你沟通</p>
- </div>
-
- </div>
- </div>
-
- <div class="layui-footer footer footer-doc">
- <p>
- Copyright © 2021 <a href="../../index.html" tppabs="http://www.layui.com/">「本站仅为 layui 文档保留的镜像站点,与官方无关」</a> MIT Licensed</p>
- <p>
- <a href="../../about/disclaimer.html" tppabs="http://www.layui.com/about/disclaimer.html" target="_blank">免责声明</a>
- <a href="../../about/relatedlinks.html" tppabs="http://www.layui.com/about/relatedlinks.html" target="_blank">友链</a>
- <a href="javascript:;" site-event="weixinmp">公众号</a>
-
-
- </p>
-
- </div>
- <script>
- window.global = {
- pageType: 'doc'
- ,preview: function(){
- var preview = document.getElementById('LAY_preview');
- return preview ? preview.innerHTML : '';
- }()
- };
- </script>
- <div class="site-tree-mobile layui-hide">
- <i class="layui-icon layui-icon-spread-left"></i>
- </div>
- <div class="site-mobile-shade"></div>
-
- <script src="/public/layui/dist/layui.js" tppabs="http://res.layui.com/layui/dist/layui.js?t=1632428048260" charset="utf-8"></script>
- <script>
- layui.config({
- base: '/public/static/lay/modules/layui/'
- ,version: '1632428048260'
- }).use('global');
- </script>
-
- </body>
- </html>
|