|
|
前面有一位开元会员在本版问站内搜索的问题，他还没有数据库等的概念，怎么样搞定站内搜索呢？我下面就介绍一个站内搜索比较好的用法
搜索谁最强？google!
我们就直接利用google提供的search API来实现，并且实现google的instant效果，直接在框内输入文字就能看到结果，尽量输入旅游相关的，因为这是个旅游网站
演示：http://www.kaiyuan.eu/view_websearch.html
说明：
1，webSearch.setSiteRestriction('www.kaiyuan.eu');限定搜索范围为www.kaiyuan.eu站内
2，最下面的CSS是隐藏google的一些信息，按照我现在的模式按钮这些可以去掉了
api手册：http://code.google.com/apis/websearch/docs/
- <script src="https://www.google.com/jsapi" type="text/javascript"></script>
- <script language="JavaScript">
- google.load('search', '1');
- var timerId;
- var input;
- var lastSearch = 0;
- var contentDiv;
- function search(query) {
- lastSearch++;
- webSearch = new google.search.WebSearch();
- webSearch.setSiteRestriction('www.kaiyuan.eu');
- webSearch.setSearchCompleteCallback(this, searchComplete, [webSearch, lastSearch]);
- webSearch.execute(query);
- }
- function autoSearch() {
- var query = this.value;
- if (timerId) {
- window.clearTimeout(timerId);
- timerId = null;
- }
- timerId = window.setTimeout('search(\'' + query + '\')', 250);
- }
- function searchComplete(searcher, searchNum) {
- if (searchNum == lastSearch) {
- var lastResults = document.getElementById('results');
- if (lastResults) {
- lastResults.parentNode.removeChild(lastResults);
- }
- var results = searcher.results;
- var newResultsDiv = document.createElement('div');
- newResultsDiv.id = 'results';
- for (var i = 0; i < results.length; i++) {
- var result = results[i];
- var resultHTML = '链接地址:<a href="' + result.unescapedUrl + '" target="_blank"><em>' +
- result.unescapedUrl + '</em></a><br />标题:' + result.title + '<br />内容提要:' + result.content +
- '<br/><br/>';
- newResultsDiv.innerHTML += resultHTML;
- }
- contentDiv.appendChild(newResultsDiv);
- }
- }
- function OnLoad() {
- contentDiv = document.getElementById('content');
- input = new google.search.SearchForm(true, contentDiv);
- input.input.onkeyup = autoSearch;
- input.setOnSubmitCallback = function() {
- search(input.input.value);
- };
- }
- google.setOnLoadCallback(OnLoad);
- </script>
- <style>
- .gsc-search-button, .gsc-clear-button, .gsc-branding{
- display:none;
- }
- </style>
- <body>
- <div id="content">Loading...</div>
- </body>
|
|
狗仔卡
发表于 27.1.2011 13:04:07
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
抢沙发
千斤顶
显身卡
发表于 27.1.2011 15:12:48
