各位大侠,可否学习下你们的Ajax请求的信息流加载案例、Ajax请求的分页案例?

未结贴
12 586
我对JS不是特别懂,我硬是弄了好几天仍没弄明白,只得再次来咨询了,各位大侠别笑我哈。
我把所有的 http://fly.layui.com/case/2017/、http://fly.layui.com/case/2016/ 案例都看了,没有一个做成这种用Ajax请求的信息流的。
官方给的示例 http://www.layui.com/doc/modules/flow.html 没有具体Ajax实例,
我因此想知道,示例中的“ /api/list?page=” 这个请求文件的JOSN格式是什么样的。

各位大侠,你们手头有现成的Ajax请求的信息流加载案例、Ajax请求的分页案例吗?
分享给我学习下啊!
  • ✿巭涛 ✿巭涛
    2017-03-18 19:01:55
    @Absolutely
    非常感谢,用官方默认的信息流代码套进去,居然可以使用了。
    原来就是原来后台返回是字符串的问题。

    我用的是PHP,只要在PHP代码开始处加一行 header('Content-type:text/json'); 就OK了。

    如果没有兄弟指点,我可能会一直都纠结如此,再次感谢。
    1 回复
  • ✿巭涛 ✿巭涛
    2017-03-17 16:00:37
    下面是我的写法,一直不对,还望高手们赐教:

    我的前端页面是这样写的:
     <ul class="flow-default" style="height: 300px;" id="clist">
    <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li>
    </ul>
    <script>
    layui.use('flow', function(){
    var flow = layui.flow;
    flow.load({
    elem: '#clist' //指定列表容器
    ,done: function(page, next){ //到达临界点(默认滚动触发),触发下一页
    var lis = [];
    $.get('/pu.php?a=clist&catid=13&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);
    });
    }
    });
    });
    </script>
    调用的页面/pu.php?a=clist&catid=13&page 内容这样写的:
    {"pages":10,"data":[{"title":"\u65e2\u7136\u505a","url":"\/art\/1078.php","catid":"13","updatetime":"1489026330"},{"title":"\u65e2\u7136\u505a","url":"\/art\/1077.php","catid":"13","updatetime":"1488963402"},{"title":"\u65e2\u7136\u505a","url":"\/art\/1076.php","catid":"13","updatetime":"1488945649"},{"title":"\u65e2\u7136\u505a","url":"\/art\/1074.php","catid":"13","updatetime":"1488941090"},{"title":"\u65e2\u7136\u505a","url":"\/art\/1073.php","catid":"13","updatetime":"1488937874"}]}
    可一直都显示“没有更多了”,

    可能是JSON这个数据格式有问题,要是能有个实实在在的案例就好了。
    0 回复
  • Absolutely Absolutely
    2017-03-17 16:39:06
    你说的这两个功能 我正好做了!在我的后台管理系统里面,有个叫Global.js的文件,里面有代码,我还没整理,你不嫌麻烦可以去下载来看看!
    0 回复
  • ✿巭涛 ✿巭涛
    2017-03-17 17:24:55
    @Absolutely 在哪下载您的代码啊?
    0 回复
  • Absolutely Absolutely
    2017-03-17 17:29:26
    0 回复
  • ✿巭涛 ✿巭涛
    2017-03-17 19:42:11
    @Absolutely 不错,非常感谢,分页有了,但信息流加载没看到,望指点下。
    0 回复
  • Absolutely Absolutely
    2017-03-17 19:42:50
    @✿巭涛 在版本更新那个菜单里面
    0 回复
  • Absolutely Absolutely
    2017-03-17 19:43:45
    @✿巭涛 但是我这里目前数据不够,等数据够了,就有效果!
    0 回复
  • ✿巭涛 ✿巭涛
    2017-03-18 10:45:04
    @Absolutely 十分感谢,终于看到个实实在在的案例了。
    0 回复
  • ✿巭涛 ✿巭涛
    2017-03-18 11:14:34
    @Absolutely
    您的文件 http://www.lyblogs.cn/Areas/Admin/Scripts/updatelog-index.js 第51行
    laye.msg(res.Message);
    貌似少敲了一个 r 字母。

    另外,我按照您的代码重新理了下,还是不成功,一直都在打圈,可否帮忙看下是哪里出了问题么?
    我的测试网址是:http://m.haogouwu.com/flow.html ,谢谢了。
    0 回复
  • Absolutely Absolutely
    2017-03-18 14:07:30
    @✿巭涛 嗯 少个R 我发现了!

    你的问题是后台返回的数据是json字符串,我的后台返回的是json对象!
    所以你需要添加JSON.parse(res);或者eval('(' + res+ ')')转换一下
    0 回复
  • ✿巭涛 ✿巭涛
    2017-03-18 18:45:09
    @Absolutely
    原来返回的数据还有对象与字符串之分,哎,原来我一直都找不到庙门啊。
    我把后台返回的数据转换成了json对象,可以获取到值了,但但为何显示时还是在打圈?
    0 回复
近期热议
新版本只是短暂搁置,并非放弃 46
用layer弹出层没有效果为什么? 20
关于图片上传时 一直提示 “请对上传接口返回JSON字符” 14
等待Layui2.0的发布 13
layPage渲染失败 13
寻求高手做 PHP网站定制,PHP二次开发 前端,后端,功能 13
某些人,请自觉。。。 12
怎么修改 导航栏,选项卡等等的 颜色? 11
lay tab 怎么设置第一个不带关闭 其他的带关闭按钮 9
select选项选择后不能选取默认的请选择选项 9