<optgroup id="sosok"><acronym id="sosok"></acronym></optgroup><table id="sosok"></table>
  • <li id="sosok"></li>
    <kbd id="sosok"></kbd>
  • <optgroup id="sosok"><acronym id="sosok"></acronym></optgroup>
    <option id="sosok"></option>
  • AB模板網:專注于dede模板,織夢源碼,織夢模板,網站模板下載,dedecms模板,網站源碼,dedecms教程以及各類手機網站模板和企業網站模板分享.

    織夢模板

    網站模板搜索
    營銷型模板 政府網站模板 自適應模板 雙語模板 標簽大全

    注冊

    DEDECMS織夢模板使用ajax無刷新實現站內搜索功能的教程

    網站模板下載 www.813358.com / 2021-05-22
    織夢使用ajax無刷新實現站內織夢搜索具體實現步驟:
    1、打開你的首頁網站模板,在</head>之前加入

    <script language="javascript" type="text/javascript" src="{dede:global.cfg_templets_skin/}/js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript">
        function lookup(inputString) {
            if(inputString.length == 0) {
                // Hide the suggestion box.
                $('#suggestions').hide();
            } else {
                $.post("/plus/search_list.php", {queryString: ""+inputString+""}, function(data){
                    if(data.length >0) {
                        $('#suggestions').show();
                        $('#autoSuggestionsList').html(data);
                    }
                });
            }
        } // lookup
          
        function fill(thisValue) {
            $('#inputString').val(thisValue);
            setTimeout("$('#suggestions').hide();", 200);
        }
    </script>
    jquery-1.7.1.min.js這個jquery庫需要你自己下載,這里就不多說了。本人用的是這個版本的。
     
    這段代碼中的search_list.php就是本文下載的文件,下載后放入/plus目錄下。
     
    2、打開head.htm,找到搜索部分的from表單代碼修改為

    <form  name="formsearch" action="{dede:global.cfg_cmsurl/}/plus/search.php" id="formkeyword">
     
              <label for="header-subscribe-email"> </label>
     
              <input type="hidden" name="kwtype" value="0" />
     
              <input type="text" name="q" size="24"  value="在這里搜索..." onfocus="if(this.value=='在這里搜索...'){this.value='';}"  onblur="if(this.value==''){this.value='在這里搜索...';}" id="inputString" onkeyup="lookup(this.value);" onblur="fill();">
     
              <input type="submit" value="搜索" />
     
              <div id="suggestions" >
     
                <div><ul id="autoSuggestionsList"></ul></div>
     
              </div>
     
            </form>
    這部分可以根據你自己的代碼的實際情況具體修改,主要是輸入關鍵字的input和下邊加的DIV層。
     
    3、打開你自己的樣式表css文件,在最后加入

    .suggestionsBox { position:relative; left:0px;width: 250px; background: white;border: 1px solid #dcdcdc;color: #323232; z-index:999; }
     
    .suggestionList { margin: 0px; padding: 0px; }
     
    .suggestionList li { margin: 0px 0px 3px 0px; position:relative;padding: 3px; cursor: pointer;list-style:none;padding-left:5px;height:20px;overflow:hidden}
     
    .suggestionList li:hover { background-color: #659CD8; }
     
    .jr{position:absolute;top:9px;right:-5px}
    此樣式可以根據自己的網站定義噢。
    然后下載search_list.rar,下載后解壓得search_list.php到放入/plus目錄下。在這個文件里有詳細注解。可根據實際情況調整。所有結果都是由這個文件來返回的。
    本文由AB模板網整理發布,轉載請說明出處:http://www.813358.com/dedecmsjc/8527.html

    有問題可以加入織夢技術QQ群一起交流學習

    ☉首先聲明,只要是我們的vip會員全站所有資源均可以免費下載,不做任何限制(了解更多)

    ☉本站的源碼不會像其它下載站一樣植入大量的廣告。

    ☉本站提供的織夢源碼,都是做好測試好發布的,均可放心使用。

    ☉本站提供的織夢源碼,均帶數據及演示地址。可以在任一源碼詳情頁查看演示地址。

    ☉為了vip利益的最大化,我們還提供了vip贈品(了解更多

    ☉如有其他問題,請加網站客服QQ(9490489)進行交流。

    相關教程

    織夢模板_隨機Tags

    工業帳篷網站模板 打印設備網站模板 酒店管理網站模板 機械制造網站模板 建材陶瓷網站模板 廚具網站模板 家庭衛浴網站模板 空氣質量檢測網站模板 母嬰知識網站模板 螺絲網站模板 農業種植網站模板 換鎖網站模板

    推薦教程

    首頁 VIP專區 html模板 會員中心
    第一福利视频网站在线,久草在线新视免费首页,久草草在线视视频免费为大家提供最新最全的免费电影,电视剧,综艺,动漫无广告在线云点播,全网更新最快。希望大家喜欢!