首頁 > Javascript > 如何自己做搜尋列 ?

如何自己做搜尋列 ?

如果想在自己的網站做一個可以搜尋各知名網站的搜尋列該怎做呢?
其實一般搜尋網都是用get去接收指令,如下..

Google

http://www.google.com.tw/search?q=

奇摩搜尋

http://tw.search.yahoo.com/search?ei=UTF-8&p=

奇摩知識+

http://tw.search.yahoo.com/search/kp?p=

MSN搜尋

http://search.msn.com.tw/results.aspx?q=

此時我們只要得知各搜尋網的GET參數,就可以動手做一個搜尋器..
以下code作者為,重灌狂人,也就是藍色小舖 Bryan不來ㄣ

點我範例下載

Javascript


<SCRIPT>

//-----TagSelector Javascript begin-----

//TagSelector by Bryan不來ㄣ

//圖片取材自藍色小鋪(www.blueshop.com.tw)

var TagSelector = {

	tags: ["Google","Yahoo","知識+","MSN"],  //您只需要更改這一行的標籤內容&#65292;其餘js及css直接套用&#65292;不需要變動

	create: function() {

		var tr = document.getElementById("TagSelector").rows[0];

		var tagArr = this.tags;

		for (var i=0;i<tagArr.length;i++) {

			var td = tr.insertCell(-1);

			td.innerHTML = '<table border="0" cellpadding="0" cellspacing="0"><tr>' +

				'<td><img border="0" src="tag_left.gif" width="5" height="28"' + (i == 0 ? '' : 'style="visibility:hidden"') + '></td>' +

				'<td class="' + (i == 0 ? "tag" : "normal") + '_middle"><a href="javascript:" onclick="TagChangeItem(this,' + i + ');return false">' + tagArr[i] + '</a></td>' +

				'<td><img border="0" src="tag_right.gif" width="5" height="28"' + (i == 0 ? '' : 'style="visibility:hidden"') + '></td></tr></table>';

			td = tr.insertCell(-1);

			if (i < tagArr.length-1)

				td.innerHTML = '<img src="tag_line.gif">';	

		} 

	}

}

TagSelector.create();

var tagIndex = 0;

function TagChangeItem(obj,n) {

	if (n == tagIndex) return;

	var tr = document.getElementById("TagSelector").rows[0].cells[tagIndex*2].getElementsByTagName("table")[0].rows[0];	

	tr.cells[0].firstChild.style.visibility = "hidden";

	tr.cells[1].className = "normal_middle";

	tr.cells[2].firstChild.style.visibility = "hidden";

	tr = obj.parentNode.parentNode;

	tr.cells[0].firstChild.style.visibility = "visible";

	tr.cells[1].className = "tag_middle";

	tr.cells[2].firstChild.style.visibility = "visible";

	tagIndex = n;

	document.searchForm.key_word.focus();	

}

//-----TagSelector Javascript end-----

function search() {

	var keyword = document.searchForm.key_word.value;

	if (keyword == "") return;

	var url = "";

	switch (tagIndex) {

		case 0:

			url = "http://www.google.com.tw/search?q=";

			break;

		case 1:

			url = "http://tw.search.yahoo.com/search?ei=UTF-8&p=";

			break;

		case 2:

			url = "http://tw.search.yahoo.com/search/kp?p=	";

		break;	

		case 3:

			url = "http://search.msn.com.tw/results.aspx?q=";				

	}

	url += encodeURIComponent(keyword);

	//location.href = url;

	newwin = window.open(url,"TagSelectorSearch");

	newwin.focus();

}

document.searchForm.key_word.focus();

</SCRIPT>

html


<FORM name=searchForm onsubmit="search();return false">

<TABLE id=TagSelector cellSpacing=3 cellPadding=0 border=0><TBODY><TR></TR></TBODY></TABLE>

<INPUT id=key_word name=key_word>

<INPUT type=image src="search.gif" align=absMiddle>	

</FORM>

相關文章:

Categories: Javascript Tags: 485
  1. 本篇文章目前尚無任何評論。
  1. 本篇文章目前尚無任何 trackbacks 和 pingbacks。