02
18
Google AJAX Search APIで検索窓を設置してみる3 - 検索結果の表示方法
Google AJAX Search API基本形では検索結果を1件表示されていましたが、今回は表示方法を変えてみます。4件表示と検索結果を閉じた状態にしておくものがあります。
Loading
CSSとbody部分はGoogle AJAX Search API基本形と同じで、JavaScriptを下記のとおりになります。
<script src="http://www.google.com/uds/api?file=uds.js&v=1.0&key=取得したAPI key" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function OnLoad() {
// Create a search control
var searchControl = new GSearchControl();
// web検索を4件表示
options = new GsearcherOptions();
options.setExpandMode(GSearchControl.EXPAND_MODE_OPEN);
searchControl.addSearcher(new GwebSearch(), options);
// ニュース検索を1件表示
options = new GsearcherOptions();
options.setExpandMode(GSearchControl.EXPAND_MODE_PARTIAL);
searchControl.addSearcher(new GnewsSearch(), options);
// ブログ検索は閉じた状態
var options = new GsearcherOptions();
options.setExpandMode(GSearchControl.EXPAND_MODE_CLOSED);
searchControl.addSearcher(new GblogSearch(), options);
searchControl.draw(document.getElementById("searchControl"));
searchControl.execute("");
}
GSearch.setOnLoadCallback(OnLoad);
//]]>
</script>
【関連記事】
Google AJAX Search APIで検索窓を設置してみる5 - 検索窓と結果を別に
Google AJAX Search APIで検索窓を設置してみる4 - サイト内検索
Google AJAX Search APIで検索窓を設置してみる3 - 検索結果の表示方法
Google AJAX Search APIで検索窓を設置してみる2 - タブバージョン
Google AJAX Search APIで検索窓を設置してみる
Google AJAX Search APIで検索窓を設置してみる5 - 検索窓と結果を別に
Google AJAX Search APIで検索窓を設置してみる4 - サイト内検索
Google AJAX Search APIで検索窓を設置してみる3 - 検索結果の表示方法
Google AJAX Search APIで検索窓を設置してみる2 - タブバージョン
Google AJAX Search APIで検索窓を設置してみる
















