大家都在搜：
开源软件
技术教程
源码分享
网站模版
当前位置： 首页>技术教程>CMS教程>织梦CMS>正文

织梦dedecms栏目切换的详细介绍

来源：爱站网时间：2022-06-23编辑：网友分享
有想要了解织梦dedecms栏目切换的详细介绍内容的小伙伴吗？爱站技术频道小编为大家准备了以下相关资料。如果你感兴趣的话一定不要错过这篇文章。

简化部分主要是栏目切换时,除子第一个默认栏目,其它的全改成ajax,不再生成静态页,而且通过PHP循环,简化了代码.另外加载更多按钮等也修改了触发形式.

一,模板

模板中涉及一个函数.get_url_by_typeid2() 在这里的说明,点击查看

[html] view plain copy
 
  1. div class="container  margin-top over-hidden">  
  2. div class="xl12 xb12 over-hidden">  
  3.           
  4.         style type="text/css">  
  5.           
  6.         .slideTxtBox{ width:100%;  text-align:left;  }  
  7.         .slideTxtBox .hd{ height:38px; line-height:27px;  position:relative; overflow:hidden }  
  8.         .slideTxtBox .hd ul{left:10px; float:left; position:absolute;  top:3px; height:39px;over-flow:hidden;}  
  9.         .slideTxtBox .hd ul li{height:40px; float:left;color:#fff;padding:0px 7px 0px 6px; cursor:pointer;  }  
  10.         .slideTxtBox .hd ul li a{color:#fff; }  
  11.         .slideTxtBox .hd ul li.on   
  12. {background:url({dede:global.cfg_templets_skin/}/images/bg5.png) repeat-x; }  
  13.         .slideTxtBox .hd ul li.on a{color:#555}  
  14.         .slideTxtBox .bd ul{zoom:1;padding-bottom:50px;display:none;position:relative;min-height:100px}  
  15.         .slideTxtBox .bd li{ height:24px; line-height:24px;   }  
  16.           
  17.   
  18.   
  19.         style>  
  20.   
  21.   
  22.         div id="slideTxtBox"class="slideTxtBox  padding00"style="overflow:visible !important;">  
  23.               
  24.             div class="hd bg-main pr">  
  25.                 ul id="tab"class="border-top border-main border-big">  
  26.                 li class="on"id="">a href="javascript:"onclick="javascript:loadMoreApply(1,0);">全部a>li>  
  27.                   
  28.                     {dede:channel type='top' row='50' }  
  29.         li id="tab[field:id/]">a href="javascript:"onclick="javascript:change_tab([field:id/]);loadMoreApply(1,[field:id/]);" >[field:typename/]a>li>  
  30.         {/dede:channel}  
  31.           
  32.           
  33.           
  34.                 ul>  
  35.               
  36.                 span class="icon-angle-down text-white width30 padding-left10  ib text-22  top7 right2 bg-main"  data-target="#navbar2">  
  37.       span>  
  38.             div>  
  39.               
  40.               
  41.             div class="navbar-body margin-top6  hidden  ib" id="navbar2">  
  42.         ul class="nav nav-inline nav-menu  ">     
  43.       {dede:channelartlist typeid="top" row='33' }   
  44. li class="{dede:field.active/}">  
  45. a  href="javascript:"onclick="javascript:change_tab({dede:field.typeid/});loadMoreApply(1,{dede:field.typeid/});">  
  46. {dede:field name="typename"/}  
  47. a>   
  48. li>   
  49. {/dede:channelartlist}   
  50.         ul>  
  51.     div>  
  52.             div class="bd"id="slideTxtBox-bd">  
  53.               
  54.                 ul id="0" class="show">  
  55.                   
  56.               
  57.     {dede:arclist row='2' titlelen='100' orderby='id' }  
  58.     div class="bg-fff    width-100 ib pr">  
  59.         div class="xl12  padding10" >  
  60.             div class="media media-x">  
  61.     a class="float-left" href="[field:arcurl/]">  
  62.         img src="[field:litpic/]" width="80" class="radius" alt="[field:title/]">  
  63.     a>  
  64.     div class="media-body" style="width:900px;height:;">  
  65.         strong>[field:title/]strong>   
  66.         div style="height:5px;">div>  
  67.           
  68.          span>   
  69.    span class=" cursor icon-click">      span>  
  70.    script src="/plus/count_list.php?view=yes&aid=[field:id/]" type='text/javascript' language="javascript">script>span>  
  71.   
  72.  span  id="diggNum[field:id/]">a href="javascript:"class=" text-bbb text-16 width33 " onclick="javascript:postDigg('good',[field:id/])">span id="digg[field:id/]" class="icon-heart2 ">     span> a>[field:goodpost/]   
  73. span>    
  74.     div style="height:12px;">div>  
  75.       
  76.         a  class="button bg-gray button-little radius-none margin-right2 text-12"href="javascript:"onclick="javascript:change_tab([field:typeid/]);loadMoreApply(1,[field:typeid/]);">[field:typename/]a>[field:typeid2 function="get_url_by_typeid2(@me)"/]  
  77.     div>  
  78. div>  
  79. div>  
  80.    a class="button bg-main button-small right5 text-white ib   pa text-14"href="javascript:;"   onclick="showtip('[field:title/]')"style="top:40px">进入小程序a>  
  81. div>  
  82. {/dede:arclist}  
  83.   
  84. p class="text-center margin-bottom bottom0  right width-100" >a onclick="javascript:loadMoreApply(1,0);"href="javascript:"class="button radius-rounded border-main"id="0data">加载更多a>p>  
  85.                 ul>  
  86.                   
  87.                   
  88.     {dede:channel type='top' row='25' }  
  89.                   
  90.         ul id="[field:id/]">  
  91.         p class="text-center  bottom0 margin-bottom margin-big-top width-100">a onclick="javascript:loadMoreApply(1,[field:id/]);"href="javascript:" class="button radius-rounded border-main"id="[field:id/]data">加载更多a>p>  
  92.     ul>  
  93.     {/dede:channel}  
  94.       
  95.             div>  
  96.               
  97.           
  98.         div>  
  99.           
  100. script type="text/javascript">  
  101. var tabs=document.getElementById("tab").getElementsByTagName("li");  
  102. var divs=document.getElementById("slideTxtBox-bd").getElementsByTagName("ul");  
  103. for(var i=0;itabs.length;i++){  
  104. tabs[i].onclick=function(){change(this);}  
  105. }  
  106. function change(obj){  
  107. for(var i=0;itabs.length;i++)  
  108. {  
  109. if(tabs[i]==obj){  
  110. tabs[i].className="on";  
  111. divs[i].className="show";  
  112. }  
  113. else{  
  114. tabs[i].className="";  
  115. divs[i].className="";  
  116. }  
  117. }  
  118. }  
  119.   
  120.   
  121. //所属分类切换  
  122. function change_tab(typeid){  
  123.   
  124. $("#tab"+typeid).siblings("li").removeClass("on");  
  125.   
  126. $("#tab"+typeid).addClass("on");  
  127.   
  128. $("#"+typeid).siblings("ul").removeClass("show");  
  129.   
  130. $("#"+typeid).addClass("show");  
  131.   
  132. }  
  133.   
  134.   
  135. script>  
  136.           
  137.   
  138.           
  139. div>  
  140.   
  141.   
  142. div>  
  143. script type="text/javascript">     
  144.   
  145. $('.icon-angle-down').each(function() {  
  146.         var e = $(this);  
  147.         var target = e.attr("data-target");  
  148.         e.click(function() {  
  149.             $(target).toggleClass("hidden");  
  150.         });  
  151.     });  
  152.       
  153. var loadConfig = {  
  154.                 url_api:'/plus/list.php',  
  155.                 //typeid:{dede:field name="typeid"/},  
  156.                 pagesize:2,  
  157.                 loading : 0  
  158.                 }  
  159.                 var page0=2;  
  160.           
  161.                   
  162.                 {dede:channel type='top' row='25' }  
  163.             var page[field:id/]=1;  
  164.     {/dede:channel}  
  165.       
  166.       
  167. function  loadMoreApply(orderby,typeid){  
  168. $("#navbar2").addClass("hidden");  
  169.          eval(" page =page"+typeid+";");  
  170.           
  171.          var pagesize = loadConfig.pagesize;  
  172.          var url = loadConfig.url_api,  
  173.          data={ajax:'pullload',typeid:typeid,page:page,pagesize:pagesize,orderby:orderby};  
  174.             function ajax(url, data) {  
  175.                 $.ajax({url: url,data: data,async: false,type: 'GET',dataType: 'json',success: function(data) {  
  176.                   
  177.                     addContent(data,typeid);      
  178.                       
  179.                 }});  
  180.                   
  181.             }  
  182.             ajax(url,data);  
  183. }  
  184.  function addContent (rs,typeid){  
  185.     if(rs.statu== 1){  
  186.         var data = rs.list;  
  187.         var total = rs.total;  
  188.         var arr=[];  
  189.         var length = data.length;  
  190.         for(var i=0;ilength;i++){  
  191.           
  192.           
  193.             arr.push('div class="bg-fff    width-100 ib pr">');  
  194.             arr.push('div class="xl12  padding10">div class="media media-x">a class="float-left" href="'+data[i].arcurl+'">img src="'+data[i].picname+'" width="80" class="radius" alt="'+data[i].title+'">a>div class="media-body" style="width:900px">strong>'+data[i].title+'strong>div style="height:5px;">div>span> span class=" cursor icon-click">      span>'+data[i].click+'span>');  
  195.             arr.push('span  id="diggNum'+data[i].id+'">a href="javascript:"class=" text-bbb text-16" onclick="javascript:postDigg(\'good\','+data[i].id+');">span id="digg'+data[i].id+'" class="icon-heart2 ">     span> a>'+data[i].goodpost+'span>  div style="height:12px;">div>');  
  196.       
  197.   
  198. arr.push('a  class="button bg-gray button-little radius-none margin-right2 text-12"href="javascript:"onclick="javascript:change_tab('+data[i].typeid+');loadMoreApply(1,'+data[i].typeid+');">'+data[i].typename+'a>'+data[i].typeid2+'div>div>div>a class="button bg-main button-small right5 text-white ib   pa text-14"href="javascript:;"   onclick="showtip(\''+data[i].title+'\')"style="top:40px">进入小程序a>div>');     
  199.   
  200. }  
  201.               
  202.         $('#'+typeid).append(arr.join(''));  
  203.       
  204.         loadConfig.load_num = rs.load_num;  
  205.         if(totalpage*loadConfig.pagesize || page> loadConfig.load_num){  
  206.             //$('#'+typeid).append('p class="text-center margin-top">a href="javascript:" class="button radius-rounded border-main width-20"id="'+typeid+'data">没有了!a>p>');  
  207.         $("#"+typeid+"data").html('没有了!');  
  208.         }else{  
  209.           
  210.             //$('#'+typeid).append('p class="text-center margin-top">a href="javascript:" class="button radius-rounded border-main width-20"id="'+typeid+'data">加载更多a>p>');  
  211.         }  
  212.           
  213.          eval("page"+typeid+" ++;");   
  214.     }else{  
  215.     $("#"+typeid+"data").html('没有了!');  
  216.     }  
  217.       
  218. }  
  219.   
  220.   
  221. $(document).ready(function(){  
  222.   
  223. loadMoreApply(1,0);  
  224. $('.copy-lay .close2').click(function(){  
  225.         $('.alert2').hide();  
  226.     });  
  227.     $('.alert2').click(function(e){  
  228.         if( $(e.target).parents().hasClass('copy-lay') ){  
  229.             return;  
  230.         }else{  
  231.             $(this).hide();  
  232.         }  
  233.     });  
  234. });  
  235. function showtip(title){  
  236.     $('#alerttip,#copyBtn').html(title);  
  237.     $('.alert2').show();  
  238. }  
  239.   
  240.   
  241.   
  242.   
  243. script>  
  244.  {dede:sql sql='Select * from  `myppttype`  where id=2'}    
  245. div class="alert2 alert-copy">  
  246.             div class="copy-lay" style="[field:other/]">  
  247.                 span class="close2">span>  
  248.                 div class="copy" id="copyBtn">div>  
  249.                 div class="copy-layer-img" style="background: url('[field:pic/]') no-repeat; -o-background-size: contain; background-size: contain; ">div>  
  250.             div>  
  251.         div>  
  252.         {/dede:sql}       

 

 

 

二,,修改,plus/list.PHP 在require_once(dirname(__FILE__)."/../include/common.inc.php"); 的下面增加一段

[php] view plain copy
 
  1. if(isset($_GET['ajax'])){  
  2.      $typeid = isset($_GET['typeid']) ? intval($_GET['typeid']): 0;//传递过来的分类ID  
  3.      $orderby = isset($_GET['orderby']) ? intval($_GET['orderby']): 1;  
  4.      //print_r($orderby);exit;  
  5.      //1id排,2hot排序  
  6.   $page = isset($_GET['page']) ? intval($_GET['page']): 0;//页码  
  7.   $pagesize = isset($_GET['pagesize']) ? intval($_GET['pagesize']): 10;//每页多少条，也就是一次加载多少条数据  
  8.   $start = $page>0 ? ($page-1)*$pagesize : 0;//数据获取的起始位置。即limit条件的第一个参数。  
  9.     
  10.   $ntime2 = gmmktime(0, 0, 0, gmdate('m'), gmdate('d'), gmdate('Y'));  
  11.             $limitday = $ntime2 - (40 * 24 * 3600);//40天内热文  
  12.             $orwheres = " senddate > $limitday ";  
  13.               
  14.   //$typesql = $typeid ? " WHERE typeid=$typeid" : '';  
  15.     
  16.   if($orderby==1){//id降序  
  17.     $typesql = $typeid ? " WHERE a.arcrank=0 and a.typeid=$typeid or CONCAT( ',', a.typeid2, ',' ) LIKE '%,".$typeid.",%' " : '';  
  18.      $typesql3 = $typeid ? " WHERE arcrank=0 and typeid=$typeid or CONCAT( ',', typeid2, ',' ) LIKE '%,".$typeid.",%' " : '';  
  19.   } else{//hot排序  
  20.         
  21.     $typesql = $typeid ? " WHERE a.arcrank=0 and a.typeid=$typeid or CONCAT( ',', a.typeid2, ',' ) LIKE '%,".$typeid.",%' and ".$orwheres : " WHERE ".$orwheres;  
  22.     $typesql3 = $typeid ? " WHERE arcrank=0 and typeid=$typeid or CONCAT( ',', typeid2, ',' ) LIKE '%,".$typeid.",%' and ".$orwheres : " WHERE ".$orwheres;  
  23.     
  24.    }  
  25. //print_r($typesql );exit;  
  26. //这个是用于首页实现瀑布流加载，  
  27. //因为首页加载数据是无需分类的，所以要加以判断，如果无需  
  28.    $total_sql = "SELECT COUNT(id) as num FROM `archives`  $typesql3 ";  
  29.   $temp = $dsql->GetOne($total_sql);  
  30.    
  31.   $total = 0;//数据总数  
  32.   $load_num =0;  
  33.    if(is_array($temp)){  
  34.      $load_num= round(($temp['num']-$pagesize)/$pagesize);//要加载的次数,因为默认已经加载了  
  35.      $total = $temp['num'];  
  36.    }  
  37.   //print_r($total);exit;  
  38.     
  39.               
  40.        
  41.           
  42.           
  43.   if($orderby==1){//新  
  44.   $sql = "SELECT a.*,t.typedir,t.typename,t.isdefault,t.defaultname,t.namerule,  
  45.         t.namerule2,t.ispart, t.moresite,t.siteurl,t.sitepath  
  46. FROM `archives` as a JOIN `arctype` AS t ON a.typeid=t.id    $typesql ORDER BY a.id DESC LIMIT $start,$pagesize";  
  47. }else{//热门  
  48.   
  49.   
  50.   
  51.     $sql = "SELECT a.*,t.typedir,t.typename,t.isdefault,t.defaultname,t.namerule,  
  52.         t.namerule2,t.ispart, t.moresite,t.siteurl,t.sitepath  
  53. FROM `archives` as a JOIN `arctype` AS t ON a.typeid=t.id    $typesql ORDER BY a.click DESC LIMIT $start,$pagesize";  
  54.     }  
  55. //echo "$sql";exit;  
  56.    $dsql->SetQuery($sql);//  
  57.     $dsql->Execute('list');//die(mysql_error());  
  58.    $statu = 0;//是否有数据，默认没有数据  
  59.    $data = array();  
  60.      $index = 0;  
  61. while($row = $dsql->GetArray("list")){  
  62.     $row['info'] = $row['info'] = $row['infos'] = cn_substr($row['description'],250);  
  63.      $row['id'] =  $row['id'];  
  64.      $row['typeid2']=get_url_by_typeid2($row['typeid2']);  
  65.      $row['filename'] = $row['arcurl'] = GetFileUrl($row['id'],$row['typeid'],$row['senddate'],$row['title'],$row['ismake'],  
  66. $row['arcrank'],$row['namerule'],$row['typedir'],$row['money'],$row['filename'],$row['moresite'],$row['siteurl'],$row['sitepath']);  
  67.   
  68. $row['typeurl'] = GetTypeUrl($row['typeid'],$row['typedir'],$row['isdefault'],$row['defaultname'],$row['ispart'],$row['namerule2'],$row['moresite'],$row['siteurl'],$row['sitepath']);  
  69.      
  70.   if($row['litpic'] == '-' || $row['litpic'] == ''){  
  71.       $row['litpic'] = $GLOBALS['cfg_cmspath'].'/images/defaultpic.gif';  
  72.    }  
  73.      
  74.     if(!preg_match("#^http:\/\/#i", $row['litpic']) &&$GLOBALS['cfg_multi_site'] == 'Y'){  
  75.     $row['litpic'] = $GLOBALS['cfg_mainsite'].$row['litpic'];  
  76.    }  
  77.   $row['picname'] = $row['litpic'];//缩略图  
  78.   $row['writer'] = $row['writer'];  
  79.   $row['click'] = $row['click'];  
  80.    $row['stime'] = GetDateMK($row['pubdate']);  
  81.   $row['timeago']= timeago($row['pubdate']);  
  82.   $row['typelink'] = ".$row['typeurl']."'>".$row['typename']."";//分类链  
  83.   $row['fulltitle'] = $row['title'];//完整的标题  
  84.   $row['shorttitle'] = $row['shorttitle'];//副标题  
  85.   $row['title'] = cn_substr($row['title'], 60);//截取后的标题  
  86.    $data[$index] = $row;  
  87.    $index++;  
  88. }  
  89. if(!empty($data)){  
  90. $statu = 1;//有数据  
  91. }  
  92. $result =array('statu'=>$statu,'list'=>$data,'total'=>$total,'load_num'=>$load_num);  
  93. echo json_encode($result);//返回数据  
  94. exit();  
  95. }  

不知道朋友们看懂这篇织梦dedecms栏目切换的详细介绍没有，有不懂的地方一定要及时来询问小编。想要获取更多精彩的技术内容，尽在js.aizhan.com。

上一篇：织梦CMS中pubdate与senddate的区别说明

下一篇：织梦dedecm文章主副栏目的调用

您可能感兴趣的文章

相关阅读

查看更多 >

热门软件源码

最新软件源码下载

©2009-2024Aizhan.COM粤ICP备2022129511号

公司简介|联系方法|招聘信息|广告服务|友情链接|帮助中心|意见反馈