<output id="qn6qe"></output>


      2. 

      <output id="qn6qe"><tt id="qn6qe"></tt></output>
      3. <strike id="qn6qe"></strike>
      
亚洲 日本 欧洲 欧美 视频,日韩中文字幕有码av,一本一道av中文字幕无码,国产线播放免费人成视频播放,人妻少妇偷人无码视频,日夜啪啪一区二区三区,国产尤物精品自在拍视频首页,久热这里只有精品12 
    
        
      
                
                    
                    
                
        
      
    
      
        
    
      

    

    
      
	

      
	
      
		
      
			
                
      阿里云市場

      
				
      阿里云資訊，阿里云服務器，阿里云免費備案，阿里云代維，阿里云相關問題解決QQ332465082
      
			      		
		
      
	
      

      

      
	
      
		
      
            
                
                

博客園



首頁




新隨筆



聯系


訂閱



管理



            
			
				
      
			      		
		
      
	
      

      



      

      
	
		

		
      
                    
	


      

      
	
      

      
	
	
	
      
		
      

      用織夢實現篩選的功能，其實主要就是運用到了織夢的高級搜索功能，然后用ajax去post替換掉本來的結果就可以了。
      

      其實篩選的話，主要有兩個問題需要解決，一個是前臺的篩選實現，一個是后臺根據前臺的點擊，反饋出相應的結果。
      

      于是在網上搜索了N多的資料了之后，先實現前臺的功能，就是你點了之后會有一個篩選的效果出來，當然，也只是一個效果。具體可以參照：jquery仿京東篩選效果。下面就一步一步用織夢來實現這樣的功能。
      

      首先我們先在后臺自定義模型（自定義模型都不會的同學，可以直接去面壁思過了）
      

      看到參照網站的圖片，可以發現商品的話，主要有下面的幾個字段：品牌，價格，尺寸，平臺，顯卡這五個字段。
      

      其中品牌、平臺、顯卡為option類型，價格為整數類型，尺寸為小數類型，添加模型的時候，記得勾上“使字段可以在列表的底層模板中獲得(自定義字段默認僅能在文檔模板顯示，啟用此選項將使列表查詢變慢，如無必要請不要選擇)”
      

      下面根據我們設置的這些字段，開始直接調用。假如我們的模板目錄為/templets/jingdong，那么我們開始在這個文件夾里面新建三個文件，名稱分別為filter.htm、filter.js、以及filter.css。
      

      filter.htm代碼
      

      

      

      

      


      


      

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      

      <html>
      

      <head>
      

      <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
      

      <link href="/templets/jingdong/filter.css" rel="stylesheet" type="text/css" />
      

      <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
      

      <script src="/templets/jingdong/filter.js" type="text/javascript"></script>
      

      <title>織夢仿京東篩選</title>
      

      </head>
      

      <body>
      

      <div id="filter">
      

      <dl>
      

      <dt>品牌：</dt>
      

      <dd>
      

      <div><a>全部</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>惠普(hp)</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>聯想(Lenovo)</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>聯想(ThinkPad)</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>宏基(acer)</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>華碩</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>戴爾</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>三星</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>索尼</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>東芝</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>Gateway</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>微星</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>海爾</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>清華同方</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>富士通</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>蘋果(Apple)</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>神舟</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>方正</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>優雅</a></div>
      

      </dd>
      

      </dl>
      

      <dl>
      

      <dt>價格：</dt>
      

      <dd>
      

      <div><a>全部</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>1000-2999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>3000-3499</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>3500-3999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>4000-4499</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>4500-4999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>5000-5999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>6000-6999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>7000-9999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>10000以上</a></div>
      

      </dd>
      

      </dl>
      

      <dl>
      

      <dt>尺寸：</dt>
      

      <dd>
      

      <div><a>全部</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>8.9英寸及以下</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>11英寸</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>12英寸</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>13英寸</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>14英寸</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>15英寸</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>16英寸-17英寸</a></div>
      

      </dd>
      

      </dl>
      

      <dl>
      

      <dt>平臺：</dt>
      

      <dd>
      

      <div><a>全部</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>AMD Brazos APU平臺</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>Intel Sandy Bridge平臺</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>Intel平臺</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>AMD平臺</a></div>
      

      </dd>
      

      </dl>
      

      <dl>
      

      <dt>顯卡：</dt>
      

      <dd>
      

      <div><a>全部</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>獨立顯卡</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>集成顯卡</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>核芯顯卡</a></div>
      

      </dd>
      

      </dl>
      

      </div>
      

      </body>
      

      </html>
      

      
      		

      
      

      

      

      

      

      接著昨天晚上的寫，昨天晚上說到了新建一個filter.htm，然后把上個文章的代碼復制進去，現在把filter.css以及flter.js也分別復制好。
      filter.css代碼
      

      @charset "gb2312";
      

      #filter {
      

      width:620px;
      

      height:auto;
      

      margin-left:auto;
      

      margin-right:auto;
      

      font-size:12px;
      

      }
      

      #filter dl {
      

      padding:0;
      

      margin-top:0;
      

      margin-bottom:0;
      

      clear:both;
      

      padding:4px 0;
      

      }
      

      #filter dt, dd {
      

      display:block;
      

      float:left;
      

      width:auto;
      

      padding:0;
      

      margin:3px 0;
      

      }
      

      #filter dt {
      

      height:14px;
      

      padding-bottom:4px;
      

      font-weight:bold;
      

      color:#333333;
      

      }
      

      #filter dd {
      

      color:#005AA0;
      

      margin-right:8px;
      

      }
      

      #filter a {
      

      cursor:pointer;
      

      }
      

      .seling {
      

      background-color:#005AA0;
      

      color:#FFFFFF;
      

      }
      

      .seled {
      

      background-color:#005AA0;
      

      color:#FFFFFF;
      

      }
      

      JS代碼
      

      

      // JavaScript Document
      

      $(function () {
      

      //選中filter下的所有a標簽，為其添加hover方法，該方法有兩個參數，分別是鼠標移上和移開所執行的函數。
      

      $("#filter a").hover(
      

      function () {
      

      $(this).addClass("seling");
      

      },
      

      function () {
      

      $(this).removeClass("seling");
      

      }
      

      );
      

      //選中filter下所有的dt標簽，并且為dt標簽后面的第一個dd標簽下的a標簽添加樣式seled。(感嘆jquery的強大)
      

      $("#filter dt+dd a").attr("class", "seled");
      

      //為filter下的所有a標簽添加單擊事件
      

      $("#filter a").click(function () {
      

      $(this).parents("dl").children("dd").each(function () {
      

      //下面三種方式效果相同（第三種寫法的內部就是調用了find()函數，所以，第二、三種方法是等價的。）
      

      //$(this).children("div").children("a").removeClass("seled");
      

      //$(this).find("a").removeClass("seled");
      

      $('a',this).removeClass("seled");
      

      });
      

      $(this).attr("class", "seled");
      

      alert(RetSelecteds()); //返回選中結果
      

      });
      

      alert(RetSelecteds()); //返回選中結果
      

      });
      

      function RetSelecteds() {
      

      var result = "";
      

      $("#filter a[class='seled']").each(function () {
      

      result += $(this).html()+"\n";
      

      });
      

      return result;
      

      }
      

       
      

      

      如果步驟按照織夢多條件篩選功能實現（一）和織夢多條件篩選功能實現（二）來操作的話這時候直接打開filter.htm已經可以看到效果了，那么下面要做的就是在織夢里面，用織夢的東西往里面去套。
      

      我們現在已經在欄目列表里面添加了“仿京東”這個欄目了，這個欄目模型就是使用我們在第一篇中講到的新建的模型。這個欄目的ID為“1”。然后把這個欄目的列表模板設置為我們剛剛添加的那個filter.htm。現在我們可以去更新下“仿京東”這個欄目的文檔了。更新成功，瀏覽下，嗯，可以訪問了。但是怎么跟我們剛剛制作的那個filter.htm一模一樣啊，那是因為我們還沒有在里面添加織夢的模板標簽。現在就可以隨便添加模板標簽了。
      

      我們實際是想直接調用出來我們添加的那些字段。那應該如何操作呢？
      

      這就得看看我們添加的自定義字段在數據庫中的位置了，然后把他們給“弄”出來。嗯，這里我弄出來的方式是采用自定義函數弄出來的。函數代碼如下，有需要的可以直接拿去了，但是記住是放到織夢的/include/extend.func.php里面啊，放其它位置出問題概不負責…
      

      獲得option類型數據的可取值
      

      

      

      

      //獲得所有自定義模型中的option類型可以取得的值
      

      function GetAllOption($option_name,$table="dede_jingdong")
      

      {
      

      global $dsql;
      

      $sql="show columns from ".$table." like '".$option_name."'";
      

      $dsql->SetQuery($sql);
      

      $dsql->Execute();
      

      while($row=$dsql->GetArray())
      

      {
      

      $enum=$row['Type'];
      

      }
      

      $enum_arr=explode("','",$enum);
      

      $enum_arr[0]=str_replace("enum('","",$enum_arr[0]);//去掉分割后第一個元素的enum('
      

      $enum_arr[count($enum_arr)-1]=str_replace("')","",$enum_arr[count($enum_arr)-1]);//去掉分割后最后一個元素的')
      

      return $enum_arr;
      

      }
      

      

      

      

      好了，有這個函數就可以將本來的filter.htm給簡化啦！
      

      下面是簡化后的代碼
      

      <html>
      

      <head>
      

      <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
      

      <link href="/templets/jingdong/filter.css" rel="stylesheet" type="text/css" />
      

      <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
      

      <script src="/templets/jingdong/filter.js" type="text/javascript"></script>
      

      <title>織夢仿京東篩選</title>
      

      </head>
      

      <body>
      

      <div id="filter">
      

      <dl>
      

      <dt>品牌：</dt>
      

      <dd>
      

      <div><a>全部</a></div>
      

      </dd>
      

      {dede:php}
      

      $arr=GetAllOption("pinpai");
      

      foreach($arr as $v)
      

      {
      

      echo "
      

      <dd>
      

      <div><a>$v</a></div>
      

      </dd>
      

      ";
      

      }
      

      {/dede:php}
      

      </dl>
      

      <dl>
      

      <dt>價格：</dt>
      

      <dd>
      

      <div><a>全部</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>1000-2999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>3000-3499</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>3500-3999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>4000-4499</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>4500-4999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>5000-5999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>6000-6999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>7000-9999</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>10000以上</a></div>
      

      </dd>
      

      </dl>
      

      <dl>
      

      <dt>尺寸：</dt>
      

      <dd>
      

      <div><a>全部</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>8.9英寸及以下</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>11英寸</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>12英寸</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>13英寸</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>14英寸</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>15英寸</a></div>
      

      </dd>
      

      <dd>
      

      <div><a>16英寸-17英寸</a></div>
      

      </dd>
      

      </dl>
      

      <dl>
      

      <dt>平臺：</dt>
      

      <dd>
      

      <div><a>全部</a></div>
      

      </dd>
      

      {dede:php}
      

      $arr=GetAllOption("pingtai");
      

      foreach($arr as $v)
      

      {
      

      echo "
      

      <dd>
      

      <div><a>$v</a></div>
      

      </dd>
      

      ";
      

      }
      

      {/dede:php}
      

      </dl>
      

      <dl>
      

      <dt>顯卡：</dt>
      

      <dd>
      

      <div><a>全部</a></div>
      

      </dd>
      

      {dede:php}
      

      $arr=GetAllOption("xianka");
      

      foreach($arr as $v)
      

      {
      

      echo "
      

      <dd>
      

      <div><a>$v</a></div>
      

      </dd>
      

      ";
      

      }
      

      {/dede:php}
      

      </dl>
      

      </div>
      

      </body>
      

      </html>
      

       
      

      

      織夢多條件篩選功能實現（四）
      

      

      我們已經在前臺實現了篩選的功能了，雖然價格、尺寸兩個類型沒有添加，這是因為我是要把他們固定做好，因為他們在模型中使用的類型是數字類型，并非其他三個（品牌、平臺以及顯卡）是option類型。
      

      既然前臺已經做好了，那我們就開始后臺的功能了。
      

      具體的后臺我使用的是advancesearch.php這個搜索的功能來實現的。
      

      我們復制一個advancesearch.php的模板出來，默認的advanceserach.php的模板是/templets/default/advancesearch.htm，我們把這個模板，復制到我們的自定義的模板文件夾/templets/jingdong里面，名字就叫做filter_tmp.htm。
      

      然后進入后臺，在“內容模型管理”里面選擇你所需要搜索的模型，然后點擊這個模型后面的放大鏡圖標，在“附件表可供自定義搜索的字段”中，勾選上你需要搜索的字段，自定義搜索結果模板頁，寫上我們剛剛復制的模板名稱，叫做filter_tmp.htm，確定。
      

      這里可以測試一下，能否正常使用搜索。
      

      不過好像是織夢系統自帶的不可以的，我試了好多次都不行，追蹤了一下，好像并沒有查詢附加表，于是在advancesearch.php的218行，原來的代碼是
      

       
      

      $query = "SELECT main.id AS aid,main.*,main.description AS description1, type.*
      

      FROM $maintable main
      

      LEFT JOIN #@__arctype type ON type.id = main.typeid
      

      LEFT JOIN $addontable addon ON addon.aid = main.id
      

      $where $orderby";
      

      在type.*的后面添加行一個addon.*，也就是變成如下的代碼
      

       
      

      $query = "SELECT main.id AS aid,main.*,main.description AS description1, type.*,addon.*
      

      FROM $maintable main
      

      LEFT JOIN #@__arctype type ON type.id = main.typeid
      

      LEFT JOIN $addontable addon ON addon.aid = main.id
      

      $where $orderby";
      

       
      

      然后還有124行添加 ${$var}=iconv(“utf-8″,”gb2312″,${$var}); 否則會導致中文亂碼。
      

      還有一個就是如果使用()英文括號的話，要小心了，因為會被安全sql過濾掉。
      

      下面，是我簡單的制作了下filter_tmp.htm，大家可以參考使用。
      

       
      

      {dede:datalist}
      

      <div>
      

      <strong>標題：</strong>{dede:field.title/}<br />
      

      <strong>品牌：</strong>{dede:field.pinpai/}<br />
      

      <strong>價格：</strong>{dede:field.jiage/}<br />
      

      <strong>尺寸：</strong>{dede:field.chicun/}<br />
      

      <strong>平臺：</strong>{dede:field.pingtai/}<br />
      

      <strong>顯卡：</strong>{dede:field.xianka/}<br />
      

      </div>
      

      {/dede:datalist}
      

      {dede:pagelist listsize='5'/}
      

      但是我們最終是要把這個頁面“嵌”到filter.htm中，也就是最終的列表頁里面。
      

      現在我們打開filter這個模板文件，在最下面加一個div，id設置為result，這個是用來存放最后篩選出來的結果的地方。
      

      然后打開filter.js，下面重點都是在這個js里面寫的。下面把幾個文件打包了一下，有需要的同學可以下載了。
      

      當然了，下載了出問題概不負責。。
      

      看懂的總歸可以看懂，看不懂的，說的在清楚也看不懂。。
      

      

      

      

      

      


      

	
      
	
	
      
		posted on 
2015-11-03 10:49 
阿里云服務商 
閱讀(1590) 
評論(0) 
 
收藏 
舉報

	
      

      





      

      
    
    
      
    
    
      
    
      
        
      
    
      
        
    
      
    
    
      
    
      
    

      


      



      






    

    
    





主站蜘蛛池模板：
宜黄县|
亚洲一本二区偷拍精品|
四虎精品视频永久免费|
亚洲国产日韩欧美一区二区三区|
国产地址二永久伊甸园|
亚洲 小说区 图片区 都市|
丰满人妻跪趴高撅肥臀|
潮喷无码正在播放|
亚洲色大成网站WWW久久
|
亚洲最大av一区二区|
黑人异族巨大巨大巨粗|
国产熟睡乱子伦视频在线播放
|
av午夜福利一片看久久|
九九热视频在线观看一区|
亚洲Av综合日韩精品久久久|
久久国产精品老人性|
亚洲激情一区二区三区在线|
色综合天天综合天天综|
久久精品国产一区二区三|
四虎永久免费高清视频|
国产精品中文一区二区|
国产做a爱片久久毛片a片|
国产福利萌白酱在线观看视频|
衡东县|
粉嫩一区二区三区国产精品|
久久精品A一国产成人免费网站|
国产线播放免费人成视频播放|
国产精品乱码一区二区三|
亚洲无码精品视频|
日韩中文字幕亚洲精品一|
国产卡一卡二卡三免费入口
|
日韩精品国产中文字幕|
中文激情一区二区三区四区|
久久久久99精品成人片|
国产在线观看网址不卡一区|
中文字幕有码在线第十页|
无码乱人伦一区二区亚洲一|
四虎精品视频永久免费|
午夜性色一区二区三区不卡视频
|
亚洲天堂伊人久久a成人|
成人麻豆日韩在无码视频|