激情五月婷婷综合网_奇米精品一区二区三区四区_91在线码无精品_国产精品久久久久一区二区三区_日韩一区二区在线看_99国产欧美另类久久久精品_日韩电影免费一区_亚洲欧美在线另类_9色porny自拍视频一区二区_久久一区二区三区四区_日本在线不卡视频_欧美日韩三级一区二区_亚洲欧美日韩国产综合在线_国产精品影视网_欧美中文字幕一区_制服.丝袜.亚洲.中文.综合

0712-2888027 189-8648-0214
微信公眾號

孝感風信網絡科技有限公司微信公眾號

當前位置：主頁 > 技術支持 > PHP > destoon供應模塊增加房產篩選功能

destoon供應模塊增加房產篩選功能

時間：2018-05-05來源：風信官網 點擊： 966次

先看看完成后的效果圖：

destoon供應模塊增加房產篩選功能

下面一步步來實現這樣的效果。

首先我們把這個篩選模塊的html結構寫出來，如下：

  1. <!--搜索區域開始-->  
  2.         <div class="center">  
  3.             <div class="search_area-top"></div>  
  4.             <div style="POSITION: relative" class="search_area-center">  
  5.                 <div class="search_area-text" id="Tzone">  
  6.                 <h1>區域：</h1>  
  7.                 <ul>  
  8.                   <li class="selected"><a href="javascript:goSort('Tzone',0)">全部</a></li>  
  9.                   <li><a href="javascript:goSort('Tzone',1)">桂林</a></li>  
  10.                   <li><a href="javascript:goSort('Tzone',2)">上海</a> </li>  
  11.                   <li><a href="javascript:goSort('Tzone',3)">南寧</a> </li>  
  12.                 </ul>  
  13.                 </div>  
  14.   
  15.                 <div class="search_area-text2" id="Tarea">  
  16.                 <h1>面積：</h1>  
  17.                 <ul>  
  18.                   <li class="selected"><a href="javascript:goSort('Tarea',0);">全部</a> </li>  
  19.                   <li><a href="javascript:goSort('Tarea',1);">500平米以下</a>   
  20.                   </li>  
  21.                   <li><a href="javascript:goSort('Tarea',2);">500-1000平米</a>   
  22.                   </li>  
  23.                   <li><a href="javascript:goSort('Tarea',3);">1000-1500平米</a>   
  24.                   </li>  
  25.                   <li><a href="javascript:goSort('Tarea',8);">1500平米以上</a>   
  26.                   </li></ul></div>  
  27.                 <div class="search_area-text2" id="Tprice">  
  28.                 <h1>租金：</h1>  
  29.                 <ul>  
  30.                   <li class="selected"><a href="javascript:goSort('Tprice',0);">全部</a> </li>  
  31.                   <li><a href="javascript:goSort('Tprice',1);">10元/平米以下</a>   
  32.                   </li>  
  33.                   <li><a href="javascript:goSort('Tprice',2);">10-15元/平米</a>   
  34.                   </li>  
  35.                   <li><a href="javascript:goSort('Tprice',3);">15-20元/平米</a>   
  36.                   </li>  
  37.                   <li><a href="javascript:goSort('Tprice',4);">20-25元/平米</a>   
  38.                   </li>  
  39.                   <li><a href="javascript:goSort('Tprice',5);">25元/平米以上</a>   
  40.                   </li></ul></div>  
  41.                 <div class="search_area-text2" id="Tfloor">  
  42.                 <h1>樓層：</h1>  
  43.                 <ul>  
  44.                   <li class="selected"><a href="javascript:goSort('Tfloor',0);">全部</a> </li>  
  45.                   <li><a href="javascript:goSort('Tfloor',1);">一樓</a> </li>  
  46.                   <li><a href="javascript:goSort('Tfloor',2);">二樓以上</a>   
  47.                   </li>  
  48.                   </ul>  
  49.                 </div>  
  50.                 <div class="search_area-text2" id="Tstructure">  
  51.                 <h1>結構：</h1>  
  52.                 <ul>  
  53.                   <li class="selected"><a href="javascript:goSort('Tstructure',0);">全部</a> </li>  
  54.                   <li><a href="javascript:goSort('Tstructure',1);">標準廠房</a>   
  55.                   </li>  
  56.                   <li><a href="javascript:goSort('Tstructure',2);">簡易廠房</a>   
  57.                   </li>  
  58.                   <li><a href="javascript:goSort('Tstructure',3);">鋼結構</a>   
  59.                   </li>  
  60.                   <li><a href="javascript:goSort('Tstructure',4);">其他</a>   
  61.                   </li>  
  62.                 </ul>  
  63.                 </div>  
  64.             </div>  
  65.             <div class="search_area-foot"></div>  
  66.         </div>  
  67.         <!--搜索區域結束-->  

然后在skin/default/sell.css里，為此模塊增加相應的css，如下：
 
  1. /*For search nav*/  
  2. .search_area-top{background:url(image/searcharea_top.jpg) no-repeat; height:16px;}  
  3. .search_area-center{ border-left:1px solid #f4c0a7; border-right:1px solid #f4c0a7; background:#FFFFFF; padding-left:22px; line-height:20px;}  
  4. .search_area-center2{ border-left:1px solid #f4c0a7; border-right:1px solid #f4c0a7; background:#FFFFFF; padding-left:30px; padding-right:20px;}  
  5. .search_area-text{ overflow:hidden; height:100%; padding-top:5px; padding-bottom:5px;}  
  6. .search_area-text h1{ color:#6a6a6a; font-weight:bold; float:left; font-size:12px; margin:0px; padding:0px;}  
  7. .search_area-text ul{ margin:0; padding:0; list-style:none; float:left; overflow:hidden; height:100%; width:710px;}  
  8. .search_area-text li{ list-style:none; color:#6a6a6a; float:left; width:50px; padding-left:8px; padding-right:5px; white-space:nowrap}  
  9. .search_area-text li a{ list-style:none; color:#6a6a6a;}  
  10. .search_area-text li a:hover{ list-style:none; color:#ed6b2e; font-weight:bold; text-decoration:underline;}  
  11. .search_area-text li.selected{color:#ed6b2e; font-weight:bold;}  
  12. .search_area-text li.selected a{color:#ed6b2e;}  
  13. .search_area-text li.selected a:hover{color:#ed6b2e;}  
  14. .search_area-textdown{ overflow:hidden; height:100%; width:705px; padding-top:5px; padding-bottom:3px; background:#fff7f5}  
  15. .search_area-textdown ul{ margin:0; padding:0; list-style:none; float:left; overflow:hidden; height:100%;}  
  16. .search_area-textdown li{ list-style:none; color:#ed8d61; text-decoration:underline; float:left; padding-left:10px; padding-right:10px;}  
  17. .search_area-textdown li a{color:#ed8d61; text-decoration:underline;}  
  18. .search_area-textdown li a:hover{color:#ed8d61; text-decoration:underline;}  
  19. .search_area-textdown li.selected{color:#ed8d61; font-weight:bold;}  
  20.   
  21. .search_area-text2{ overflow:hidden; height:100%; padding-top:5px; padding-bottom:5px;}  
  22. .search_area-text2 h1{ color:#6a6a6a; font-weight:bold; float:left; font-size:12px; margin:0px; padding:0px;}  
  23. .search_area-text2 ul{ margin:0; padding:0; list-style:none; float:left; overflow:hidden; height:100%; width:710px;}  
  24. .search_area-text2 li{ list-style:none; font-family:Verdana, Arial, Helvetica, sans-serif; color:#6a6a6a; float:left; padding-left:8px; padding-right:5px; white-space:nowrap}  
  25. .search_area-text2 li a{ list-style:none; color:#6a6a6a;}  
  26. .search_area-text2 li a:hover{ list-style:none; color:#ed6b2e; font-weight:bold; text-decoration:underline;}  
  27. .search_area-text2 li.selected a{color:#ed6b2e; font-weight:bold;}  
  28.   
  29. .search_area-foot{background:url(image/searcharea_foot.jpg) no-repeat; height:18px;}  

下一步，為此模塊增加javascript代碼來進行控制，如下：

(這里使用到了jquery，所以需要在template/default/sell/index.htm 頁里先引入jquery 1.7版本;

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>)

下面添加控制的js代碼：

 
  1. function getQueryString(){  
  2.      var result = location.search.match(new RegExp("[\?\&][^\?\&]+=[^\?\&]+","g"));   
  3.      if(result == null){  
  4.          return "";  
  5.      }  
  6.      for(var i = 0; i < result.length; i++){  
  7.          result[i] = result[i].substring(1);  
  8.      }  
  9.      return result;  
  10. }  
  11.   
  12. function goSort(name,value){  
  13.     var string_array = getQueryString();  
  14.     var oldUrl = (document.URL.indexOf("index.php")==-1)?document.URL+"index.php":document.URL;  
  15.     var newUrl;  
  16.     if(string_array.length>0)//如果已經有篩選條件  
  17.     {   var repeatField = false;      
  18.         for(var i=0;i<string_array.length;i++){  
  19.             if(!(string_array[i].indexOf(name)==-1)){  
  20.                 repeatField = true;//如果有重復篩選條件，替換條件值  
  21.                 newUrl = oldUrl.replace(string_array[i],name+"="+value);  
  22.             }     
  23.         }  
  24.           
  25.         //如果沒有重復的篩選字段  
  26.         if(repeatField == false){  
  27.             newUrl = oldUrl+"&"+name+"="+value;  
  28.         }  
  29.           
  30.     }else{//如果還沒有篩選條件  
  31.         newUrl = oldUrl+"?"+name+"="+value;  
  32.     }  
  33.       
  34.     //跳轉  
  35.     window.location = newUrl;  
  36. }  
  37.   
  38. function setSelected(name,value){  
  39.     var all_li = $("#"+name).find("li");  
  40.     //清除所有li標簽的selected類  
  41.     all_li.each(function(){  
  42.         $(this).removeClass("selected");  
  43.     });  
  44.     //為選中的li增加selected類  
  45.     all_li.eq(value).addClass("selected");  
  46. }  
  47.   
  48. $(document).ready(function(){  
  49.     var string_array = getQueryString();  
  50.     for(var i=0;i<string_array.length;i++){  
  51.         var tempArr = string_array[i].split("=");  
  52.         setSelected(tempArr[0],tempArr[1]);//設置選中的篩選條件  
  53.     }  
  54. });  

進入系統后臺，在供應模塊的模塊設置里增加幾個自定義字段，字段對應篩選模塊的篩選條件：

destoon供應模塊增加房產篩選功能

 

因為我們是以get方式來提交篩選條件的，所以需要對sell/index.php做一些調整，把接收到的篩選參數加入到當前變量表中，

這樣當module/sell/index.inc.php調用相應的index.htm模板時，可以以變量的方式在頁面取到篩選條件的值，修改如下：

 
  1. <?php  
  2. define('DT_REWRITE', true);  
  3. require 'config.inc.php';  
  4. require '../common.inc.php';  
  5. extract($GET,EXTR_OVERWRITE);//篩選條件參數加入到當前變量列表  
  6. require DT_ROOT.'/module/'.$module.'/index.inc.php';  
  7. ?>  

接下來我們要做的就是根據篩選條件，刷新頁面這一塊的內容就行了：

destoon供應模塊增加房產篩選功能

這一塊在template/default/sell/index.htm頁面里是以標簽的方式來調用內容的：

 
  1. <!--{tag("moduleid=$moduleid&condition=status=3$dtype&areaid=$cityid&catid=$catid&pagesize=".$MOD[pagesize]."&page=$page&showpage=1&datetype=5&order=".$MOD[order]."&fields=".$MOD[fields]."&template=list-sell")}-->  

所以我們只要把篩選條件拼接到condition里，就可以了,當然篩選條件還需要進行一些處理，這里我寫死了，改成如下代碼：
 
  1. {php $condition = "status=3";}  
  2. {php $Tarea_array = array(1=>'czzmj<500',2=>'czzmj between 500 and 1000',3=>'czzmj between 1000 and 1500',4=>'czzmj>1500');}  
  3. {php $Tprice_array = array(1=>'price=10',2=>'price between 10 and 15',3=>'price between 15 and 20',4=>'price between 20 and 25',5=>'price>25');}  
  4. {php $Tfloor_array = array(1=>'floor=1',2=>'floor>=2');}  
  5. {php $Tstructure_array = array(1=>'標準廠房',2=>'簡易廠房',3=>'鋼結構');}  
  6.   
  7.   
  8. {if isset($Tzone)&&($Tzone!=0)}  
  9. {php $condition.=" and areaid=$Tzone";}  
  10. {/if}  
  11. {if isset($Tarea)&&($Tarea!=0)}  
  12. {php $condition.=" and $Tarea_array[$Tarea]";}  
  13. {/if}  
  14. {if isset($Tprice)&&($Tprice!=0)}  
  15. {php $condition.=" and $Tprice_array[$Tprice]";}  
  16. {/if}  
  17. {if isset($Tfloor)&&($Tfloor!=0)}  
  18. {php $condition.=" and $Tfloor_array[$Tfloor]";}  
  19. {/if}  
  20. {if isset($Tstructure)&&($Tstructure!=0)}  
  21. {php $condition.=" and structure=$Tstructure";}  
  22. {/if}  
  23. <!--{tag("moduleid=$moduleid&condition=$condition$dtype&areaid=$cityid&catid=$catid&pagesize=".$MOD[pagesize]."&page=$page&showpage=1&datetype=5&order=".$MOD[order]."&fields=".$MOD[fields]."&template=list-sell")}-->  

這樣一個粗糙的篩選模塊就制作好了。

欄目列表
推薦內容
熱點內容
展開
激情五月婷婷综合网_奇米精品一区二区三区四区_91在线码无精品_国产精品久久久久一区二区三区_日韩一区二区在线看_99国产欧美另类久久久精品_日韩电影免费一区_亚洲欧美在线另类_9色porny自拍视频一区二区_久久一区二区三区四区_日本在线不卡视频_欧美日韩三级一区二区_亚洲欧美日韩国产综合在线_国产精品影视网_欧美中文字幕一区_制服.丝袜.亚洲.中文.综合
在线电影院国产精品| 欧美性三三影院| 91成人免费网站| 欧美精品一区二区久久久| 亚洲一区二区在线免费看| 丁香天五香天堂综合| 在线成人免费观看| 一区二区三区中文字幕在线观看| 国产精品一区在线| 日韩亚洲欧美在线观看| 亚洲国产日韩av| 91色九色蝌蚪| 精品国产乱码久久久久久久| 一区二区三区中文字幕精品精品| 成人一道本在线| 久久久久亚洲蜜桃| 日韩成人免费看| 欧美日韩国产在线观看| 亚洲欧美国产77777| 久久综合九色综合97婷婷| 亚洲一区二区视频在线观看| 国产成人综合在线| 日韩欧美123| 亚洲图片有声小说| 91丝袜美腿高跟国产极品老师| 国产三区在线成人av| 欧美aaaaaa午夜精品| 欧美人妖巨大在线| 亚洲mv在线观看| 裸体健美xxxx欧美裸体表演| 日本福利一区二区| 中文字幕一区二区三区在线播放| 国产成人亚洲综合a∨猫咪| 精品国产第一区二区三区观看体验| 午夜国产精品一区| 91精品福利视频| 亚洲美女少妇撒尿| av午夜精品一区二区三区| 26uuu精品一区二区在线观看| 日韩制服丝袜先锋影音| 欧美高清激情brazzers| 亚洲最新视频在线观看| 91亚洲资源网| 国产精品久久久久久久蜜臀| 国产成人综合亚洲网站| 久久夜色精品一区| 国产乱码精品一区二区三区av | 91碰在线视频| 中文字幕精品一区二区精品绿巨人| 1024国产精品| av中文一区二区三区| 国产欧美日韩麻豆91| 成人网男人的天堂| 中日韩免费视频中文字幕| 成人午夜在线视频| 国产精品久久久久aaaa樱花| 成人国产亚洲欧美成人综合网| 国产精品高潮久久久久无| 国产suv精品一区二区883| 国产午夜精品一区二区三区视频| 国产伦精品一区二区三区在线观看| 国产亚洲欧美日韩俺去了| 国产美女一区二区三区| 久久毛片高清国产| 国产一区二区三区在线观看免费视频| 久久久久国产免费免费| 1区2区3区欧美| 欧美亚洲自拍偷拍| 亚洲成人av一区二区| 色屁屁一区二区| 一区二区成人在线| 日韩一区二区在线观看视频播放| 久久精品99国产精品日本| 91精品欧美久久久久久动漫| 麻豆国产精品777777在线| 精品久久久久一区二区国产| 久久精品国产第一区二区三区| 久久综合给合久久狠狠狠97色69| www.av精品| 天天综合色天天综合色h| 亚洲精品在线电影| 91在线码无精品| 日韩精品国产精品| 国产日韩欧美一区二区三区乱码 | 久久精品国产77777蜜臀| 国产偷国产偷精品高清尤物| 国产酒店精品激情| 亚洲男同性视频| 成人做爰69片免费看网站| www.成人网.com| 亚洲美女在线一区| 欧美亚洲禁片免费| 视频一区免费在线观看| 久久久久9999亚洲精品| 91国偷自产一区二区使用方法| 丝袜美腿成人在线| 国产日韩三级在线| 色婷婷精品久久二区二区蜜臂av | 精品一二三四区| 综合色中文字幕| 欧美精品久久99久久在免费线| 国产一区二区三区免费看| 亚洲人吸女人奶水| 91.com视频| 成人性色生活片| 五月婷婷另类国产| 国产日韩影视精品| 91精品国产黑色紧身裤美女| av在线不卡免费看| 偷拍日韩校园综合在线| 国产女人aaa级久久久级 | 亚洲欧美一区二区三区极速播放| 欧美一级搡bbbb搡bbbb| 99re成人精品视频| 久久国产免费看| 亚洲一区二区偷拍精品| 久久综合狠狠综合久久综合88 | 青草av.久久免费一区| 中文字幕在线一区免费| 日韩一卡二卡三卡四卡| 一本一本大道香蕉久在线精品| 国内欧美视频一区二区| 午夜精品久久久久久久久久| 亚洲国产成人私人影院tom| 日韩亚洲国产中文字幕欧美| 色久优优欧美色久优优| 国产精品伊人色| 免费xxxx性欧美18vr| 亚洲一二三专区| 国产精品电影一区二区| 亚洲精品在线电影| 91麻豆精品国产自产在线观看一区| 成人97人人超碰人人99| 久久国产综合精品| 午夜一区二区三区在线观看| 成人免费在线观看入口| 久久综合999| 日韩欧美成人一区| 777亚洲妇女| 欧美午夜视频网站| 91一区一区三区| 成人高清视频在线观看| 久久电影网站中文字幕 | 欧美在线小视频| 91影院在线观看| 国产91精品在线观看| 精品一区二区日韩| 美女任你摸久久| 青娱乐精品视频在线| 亚洲成人av一区| 亚洲成人自拍偷拍| 亚洲影视资源网| 国产精品成人一区二区三区夜夜夜| 久久婷婷久久一区二区三区| 日韩精品最新网址| 日韩欧美国产三级| 在线播放欧美女士性生活| 欧美高清你懂得| 欧美精品乱码久久久久久按摩 | 欧美人妖巨大在线| 欧美视频第二页| 欧美综合亚洲图片综合区| 一本大道久久a久久精品综合| 91免费版在线| 色婷婷国产精品| 91黄色免费观看| 欧美亚洲国产一卡| 欧美视频你懂的| 欧美久久一区二区| 欧美一区二区不卡视频| 日韩欧美在线1卡| 欧美成人video| 日韩一区二区免费在线电影| 欧美成人福利视频| 久久综合色8888| 国产免费久久精品| 国产精品黄色在线观看| 亚洲欧美日韩成人高清在线一区| 亚洲精品欧美在线| 亚洲成人综合视频| 免费一级片91| 国产在线精品一区二区| 国产精品亚洲成人| av在线播放成人| 欧美综合一区二区| 91精品在线观看入口| 欧美成人r级一区二区三区| 久久色中文字幕| 亚洲国产电影在线观看| 综合在线观看色| 亚洲国产人成综合网站| 日韩福利视频导航| 精品制服美女丁香| 成人激情图片网| 欧美视频三区在线播放| 日韩欧美国产综合在线一区二区三区| 久久综合av免费| 亚洲欧美日韩一区二区| 午夜精品一区在线观看| 精品一区二区三区视频|