DedeCMS實現百度搜索下拉菜單提示信息功能[織夢網站模板使用教程]
閱讀 ?·? 發布日期 2019-05-27 08:22 ?·? adminDedeCMS實現百度搜索下拉菜單提示信息功能[織夢網站模板使用教程]資訊類、知識類、商城類網站都有全站搜索功能,用戶對網站比較熟悉了才考慮搜索,對新站來說,這個功能在前期暫時不考慮。
“百度站內搜索”也比較成熟了,可以設置站內搜索還是全網搜索,還能獲得廣告費用,許多人就放棄DedeCMS原生的搜索功能。如果能實現和百度搜索一樣下拉菜單來對本站標題AJAX預加載,效率會高許多,DedeCMS搜索功能比較強大,不妨跟著[織夢網站模板使用教程]利用AJAX實現這個小功能。也算是對AJAX的一種應用。
在需要增加該功能的模板</head>之前增加js代碼
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
function lookup(inputString) {
if(inputString.length == 0) {
// Hide the suggestion box.
$('#suggestions').hide();
} else {
$.post("{dede:global.cfg_cmspath/}/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>
在/plus/下增加search_list.php,代碼如下
為保證數據安全,數據庫調用以下橙色部分的還是規定范圍。
<?php
header("Content-Type: text/html;charset=utf-8");
require_once(dirname(__FILE__)."/../include/common.inc.php");
global $dsql;
if(isset($_POST['queryString'])) {
$queryString = $_POST['queryString'];
if(strlen($queryString) >0) {
$dsql->SetQuery("SELECT id,title,typeid FROM #分隔符@__archives WHERE title LIKE '%$queryString%' and arcrank=0 order by click desc LIMIT 10");
$dsql->Execute();
while ($result = $dsql->GetArray()) {
$bb=$result["title"];
//把查詢到的標題存入$bb
$bb=str_ireplace($queryString, '<font color=\'red\'>'.$queryString.'</font>', $bb);
//使查詢到的關鍵字為紅色,更改color后邊的顏色代碼,可以改變顏色。
$a=$result["typeid"];
$row=$dsql->GetOne("SELECT typedir,id FROM #分隔符@__arctype WHERE id=$a");
$aa=$row['typedir'];
$aa=str_replace("{cmspath}",$cfg_basehost,$aa);//絕對路徑處理
$id=$result['id'];
echo '<li><a target="_blank" href="'.$aa.'/'.$id.'.html">'.$bb.'</a></li>';
}
}else{
}
}else{
echo '參數為空!!';
}
?>
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}
上面的修改方法只適合utf-8版本的織夢,utf-8稱為萬國碼,兼容性更強,聽說一些手機還不兼容gbk,轉換參考文章《DedeCMS全站UTF-8和GBK無損互轉》
為您推薦
-
眉山網站建設【今日限時免費】網站 2020-01-03
-
澳門網站建設【今日限時免費】網站 2020-01-03
-
香港網站建設【今日限時免費】網站 2020-01-03
-
嘉義網站建設【今日限時免費】網站 2020-01-03
-
新竹網站建設【今日限時免費】網站 2020-01-03