分享一个简单的列表效果了(显示：列表|详细)

在做的单子里有一个列表页效果，要求可以切换显示模式。

 

列表：显示发布者，发布时间，标题等基本信息。、

 

详细：显示图文并茂的发布信息、

 

当然翻页以后还是保持和上一页的状态。

 

因为时间比较充裕，所以没动手着急做，结果胡思乱想了一阵子，以为很复杂，呵呵。

 

研究了下，发现其实挺简单，一审通过，OY！

 

通过cookie保存列表显示模式，用到了jquery里操作cookie的插件(因为有改动，所以是后面一篇里的)。

 

jquery代码：

 

$(function(){ var type = $.cookie("ltype"); if(type == null||type==""){ type="list"; $.cookie("ltype",type); } if(type == "list"){ $(".list").show(); $(".detail").hide(); }else{ $(".list").hide(); $(".detail").show(); } }); function switchlisttype(o){ if($.cookie("ltype") != o){ $.cookie("ltype",o); if(o == "list"){ $(".list").show(); $(".detail").hide(); }else{ $(".list").hide(); $(".detail").show(); } } }

 

列表部分：

 

<div> 显示 <a href="javascript:;" οnclick="switchlisttype('list')">列表</a>|<a href="javascript:;" οnclick="switchlisttype('detail')">详细</a> </div> <div> <ul> <asp:Repeater ID="rptAdsList" runat="server"> <ItemTemplate> <li class="list"> 绑定列表模式信息 </li> <li class="detail"> 绑定详细模式信息 </li> </ItemTemplate> </asp:Repeater> </ul> </div> <div> <webdiyer:AspNetPager ID="AspNetPager1" UrlPaging="true" runat="server" PageSize="3" OnPageChanged="AspNetPager1_PageChanged"> </webdiyer:AspNetPager> </div>