検索サイトを選択して検索
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>サンプル</title>
<script type="text/javascript">
<!--
var site = new Array();
site[0] = ["Excite", "http://www.excite.co.jp/search.gw", "search",
		["target", "combined"], ["c", "web"], ["lk", "excite_jp"], ["lang", "jp"]];
site[1] = ["Fresheye", "http://search.fresheye.com/", "kw"];
site[2] = ["Goo", "http://search.goo.ne.jp/web.jsp", "MT",
		["from", "USR"], ["IE", "sjis"]];
site[3] = ["Google", "http://www.google.com/search", "q",
		["hl", "ja"], ["ie", "Shift_JIS"]];
site[4] = ["Infoseek", "http://www.infoseek.co.jp/Titles", "qt",
		["sv", "JP"], ["lk", "noframes"], ["rt", "JG"], ["svx", "500"]];
site[5] = ["Yahoo", "http://search.yahoo.co.jp/bin/search", "p"];

window.onload = function() {
	if (!document.createElement) return;
	if (document.all && !window.clipboardData && !window.opera) return;

	// 検索サイトのリストを生成
	var select = document.createElement("select");
	select.id = "addlist";
	for (var i = 0; i < site.length; i++) {
		var opt = document.createElement("option");
		opt.value = i;
		var str = document.createTextNode(site[i][0]);
		opt.appendChild(str);
		select.appendChild(opt);
	}
	// デフォルトで選択状態にする場合はその配列番号を option[n] に指定
	// select.options[3].selected = true;

	// 既存の検索フォームにこのドロップダウンを追加
	var obj = document.forms[0];
	obj.elements[obj.elements.length - 1].value = "検索";
	obj.insertBefore(select, obj.elements[1]);

	// フォームが送信された時に selectSearch() を呼び出す
	obj.onsubmit = selectSearch;
}
function selectSearch() {
	var str = document.forms[0].p.value;		// 入力された検索文字
	var num = document.forms[0].addlist.value;	// 選択されたリストの番号

	// 選択された検索サイトのフォーム生成(送信先の指定)
	var setform = document.createElement("form");
	setform.action = site[num][1];
	setform.method = "GET";
	// setform.target = "_blank";		// 検索結果を新しいウィンドウに表示する場合に追加

	// 検索文字クエリ
	var query = document.createElement("input");
	query.type = "hidden";
	query.name = site[num][2];
	query.value = str;
	setform.appendChild(query);

	// 検索文字以外のクエリ
	if (site[num].length > 3) {
		for (var i = 3; i < site[num].length; i++) {
			var extra = document.createElement("input");
			extra.type = "hidden";
			extra.name = site[num][i][0];
			extra.value = site[num][i][1];
			setform.appendChild(extra);
		}
	}

	// 生成したフォームを文末に追加してそのフォームを送信
	document.body.appendChild(setform);
	setform.submit();			// document.forms[document.forms.length - 1].submit();
	return false;
}
// -->
</script>
</head>
<body>
<form action="http://search.yahoo.co.jp/bin/search" method="GET">
<input type="text" name="p" value="" size="30">
<input type="submit" value="Yahoo! 検索">
</form>
</body>
</html>

選択した検索サイトで検索するスクリプトです。検索サイトから提供されている検索フォームに追加して使用することも可能です。ただし、Macintosh 版の Internet Explorer では正常に表示、動作しない場合がありますので除外しています。この場合は選択できませんが通常の検索は使用できます。

初めにあらかじめ検索したいサイトの情報を配列内に定義しておきます。サイトの情報は、以下のように各値をクォーテーションで括ってカンマ[,]で区切って記述してください。

site[配列番号] = ["サイト名", "送信先の URL", "検索クエリ名", "検索文字以外のクエリの名前と値"];
配列番号
配列番号は 0 から始まってリストが増えるたびに 1, 2 ... としてください。
サイト名(配列の1番目)
検索するサイト名を記述してください。この名前はドロップダウンに表示される名前です。
送信先の URL(配列の2番目)
検索サイトの送信先 URL(フォームの送信先)を記述してください。
検索クエリ名(配列の3番目)
検索サイトの検索文字に指定されているクエリの引数名を記述してください。
検索文字以外のクエリの名前と値(配列の4番目以降)
検索文字以外のクエリが指定されている場合のみ name と value の値を ["名前", "値"] のように1つの配列として記述してください。
複数ある場合は配列の区切りと同様にカンマで区切ってください。

まず、ページ読み込み後に createElement() を使用して検索サイトのリストを作成して既存の検索フォームに追加します。初めから選択状態にしたい場合は select.options[3].selected = true; として options にサイトの配列番号を記述したのを追加してください。

ページ読み込み後、検索フォームに追加されるドロップダウンメニュー
<select id="addlist">
<option value="0">Excite
<option value="1">Fresheye
<option value="2">Goo
<option value="3">Google
<option value="4">Infoseek
<option value="5">Yahoo
</select>

実際の動作は、フォームに検索文字を入力して検索するサイトを選択します。送信ボタン、または Enter キーにて送信する時に関数 selectSearch が呼ばれます。そして、選択されたサイトリストの番号を取得して配列番号の値を当てはめていきます。

関数 selectSearch が呼ばれた時に送信用のフォームを生成して action 値に送信先 URL が代入されます。検索文字は、name 値に検索クエリ名、value 値に入力された検索文字列を代入して生成します。また、検索文字以外のクエリがある場合はその名前と値をそれぞれ代入して生成します。

送信時に生成されるフォーム(Google で「あいうえお」を検索する場合)
<form action="http://www.google.com/search" method="GET">
<input type="hidden" name="q" value="あいうえお">
<input type="hidden" name="hl" value="ja">
<input type="hidden" name="ie" value="Shift_JIS">
</form>

最後にここで生成されたフォームを一度ページ上に適用(このフォームは非表示 (type="hidden") なので表示はされません)して送信します。JavaScript が無効の場合は、元のフォームに指定している検索サイトで検索されます。

検索サイトから提供されている検索フォームにこのスクリプトを追加する場合は、関数 selectSearch の入力された検索文字(検索文字として送信されるテキスト部)の名前を各検索フォームの検索クエリに使用されている名前に書き換えてください。

Excite の検索フォーム(検索文字入力部の名前が search)にこのスクリプトを追加する場合
var str = document.forms[0].search.value;
Fresheye の検索フォーム(検索文字入力部の名前が kw)にこのスクリプトを追加する場合
var str = document.forms[0].kw.value;
Goo の検索フォーム(検索文字入力部の名前が MT)にこのスクリプトを追加する場合
var str = document.forms[0].MT.value;
Google の検索フォーム(検索文字入力部の名前が q)にこのスクリプトを追加する場合
var str = document.forms[0].q.value;
Infoseek の検索フォーム(検索文字入力部の名前が qt)にこのスクリプトを追加する場合
var str = document.forms[0].qt.value;
Yahoo の検索フォーム(検索文字入力部の名前が p)にこのスクリプトを追加する場合
var str = document.forms[0].p.value;
[PR] ホットペッパー