具体效果见我网站的浏览模式——列表模式↑。先看效果如果你不感兴趣就不要往下看了,免得浪费时间。
原来我在用Sablog的时候,它就可以选择默认的浏览模式是标准模式还是列表浏览模式,并且还可以记忆访客的个性化设置。使用列表模式可以一目了然,让访客知道都有哪些文章,不必一页页的点击去浏览。现在换成Emlog,只好折腾一下咯。其实这个效果我很久以前就加上了,不过之前都是不管选哪种模式,列表模式都必须是直接调用的。只不过选择标准模式时列表模式是隐藏的,点击列表时才显示出来。感觉非常的不好。最近捣鼓了一下,改为Ajax调用。即只有在选择列表模式是才会加载,否则不会调用。
大体上来说通过三步就可以实现这个效果:
第一要安装EMLOG数据调用插件。你可以点击链接去下载安装。安装好之后,进入插件设置界面新建一个数据调用,里面具体的参数可根据需要设定,下图是我设定的调用参数。
第二要在主机空间的根目录下新建一个页面命名为list.php。里面加入两行PHP代码:
<?php require_once 'init.php';?> <?php kl_data_call_for_internal(1); ?>
这时你在浏览器访问list.php页面即可看到所调用的数据,如我的http://www.wwqk.net/list.php
最后就是Ajax调用了,这里用到jQuery的load()方法,即通过 AJAX 请求从服务器加载数据,并把返回的数据放置到指定的元素中。我页面中就是通过点击列表来加载调用的数据。此方法的语法如下:
load(url,data,function(response,status,xhr))
url即刚才的list.php,data不设定,function()回调函数可根据需要设定想要的效果,不再赘述。我的代码如下:
$('#top_title span').click(function(){ $(".hide").load("list.php",function(){ $(this).removeClass().siblings().addClass("unselect"); $("#top_content>ul").slideUp('1500').eq($('#top_title span').index(this)).slideDown('1500');}); });